Angularjs not loading json files

Question

I'm not sure why when i print the json file on a html page works, also from a button calling a function, but not inside of the javascript file.

This a problem because i need to sort the data in the json file before displaying it from in the web page, i can't make it work. i tried using this solution https://stackoverflow.com/a/15463124/2796268, but the console say

jsonDat is not defined

my code:

$scope.init = function () {

        console.log("init");
    $http.get('json/file.json') .success(function(data) {
           $scope.jsonDat = res.data; 
        })
        .error(function(data,status,error,config){
            $scope.jsonDat = [{heading:"Error",description:"Could not load json   data"}];
        });

     console.log(jsonDat);

};

How i can process the json data before the page loads or when the page is loading?

looks like you want $scope.jsonDat, not jsonDat. Keep in mind you'll have access to it inside the success callback guaranteed, but everywhere else it must be treated as an asynchronous variable (it could be null or it could be resolved data) — Hypaethral
– Hypaethral, Commented Oct 15, 2015 at 17:28
@GrumbleSnatch ok, it kinda works now, but it prints an empty array — Progs
– Progs, Commented Oct 15, 2015 at 17:33

Miles P · Accepted Answer · 2015-10-15 17:31:08Z

3

You can process the data when it is returned from $http, like so:

$scope.init = function () {
    $http.get('json/file.json').success(function(data) {
        //---- SORT HERE ----
        $scope.jsonDat =  mySortFunction(data);
    });
};

answered Oct 15, 2015 at 17:31

Miles P

7104 silver badges12 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Bartosz Czerwonka · Accepted Answer · 2015-10-15 17:31:56Z

2

Try this :

$scope.init = function() {

    console.log("init");
    $http.get('json/file.json').success(function(data) {
            $scope.jsonDat = data;
            console.log($scope.jsonDat);
        })
        .error(function(data, status, error, config) {
            $scope.jsonDat = [{
                heading: "Error",
                description: "Could not load json   data"
            }];
            console.log($scope.jsonDat);
        });

};

In success you have data but you try get from res.data. When you use success then it is not response with data but only your data.

answered Oct 15, 2015 at 17:31

Bartosz Czerwonka

1,6511 gold badge11 silver badges11 bronze badges

Comments

SakthiSureshAnand · Accepted Answer · 2015-10-15 17:43:48Z

1

I thought you wanna sort some JSON file then display it in HTML page . So My Idea is get that JSON file (you tried)

$http.get('json/file.json') .success(function(data) {
       $scope.jsonDat = data.res; 
       console.log('Checking the result',angular.toJson($scope.jsonDat));
    })

But putting your result in

$scope.jsonDat = data.res;

eg,

sortService.sortJsn = data.res;

$scope.jsonDat instead create angular service pour your data there then you can access those data any where in your controller sort it also show it in HTML.

answered Oct 15, 2015 at 17:43

SakthiSureshAnand

1,3621 gold badge20 silver badges36 bronze badges

Collectives™ on Stack Overflow

Angularjs not loading json files

3 Answers 3

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related