CODEWITHSUNDEEP
javascriptangularjsjsonionic-framework
arslan
arslan

Reputation: 25

Angular JS - Cannot read local JSON file

Before my query worked in a sample 1 page(index.html) project but this time , i am working on a project which have tabs(i created project by Ionic Lap with tabs). And i need to print output of JSON file in tab-home.html page. Which not in same local of JS and index.html.

Tab pages are in /Template folder (tabs.html,tab-home.html,tab-account.html) JS are in /JS folder (app.js,controllers.js,services.js and employees.json)

Here is my codes

in controllers.js 

.controller('HomeCtrl', function($scope, webtest) {
    webtest.fetch().then(function(data) {
        $scope.data = data;
    })
})

in services.js

.factory('webtest', function($q, $timeout, $http) {
    var Webtest = {
        fetch: function(callback) {
            return $timeout(function() {
                return $http.get('employees.json').then(function(response) {
                    return response.data;
                });
            }, 30);
        }
   };

   return Webtest;
});

in tab-home.html

<ion-item class="item-remove-animate item-avatar item-icon-right" ng-repeat="item in data">

    <h2>{{item.product_name}}</h2>   
</ion-item>

I didn't touch app.js and index.html. They have default codes.

Thanks everyone, Mehmet.

Upvotes: 0

Views: 895

Answers (2)

EL missaoui habib
EL missaoui habib

Reputation: 1075

your response should be like {"data": {....

if no : 

 return $http.get('employees.json').then(function(response) {
                return response;
            });

Upvotes: 2

Mark Evaul
Mark Evaul

Reputation: 653

Are you trying to do this directly off your hard drive? Like the url in the address bar is file://yadda-yadda-yadda? If so, ajax doesn't work on local files. You need to run off a webserver. WAMP (http://www.wampserver.com/en/) is a project to quickly set up a local web server on windows if that is your operating system.

Upvotes: 0

Related Questions