how to read json file before calling controller using resolve?

Question

I am trying to read json file and get data before controller call .But I am not able to display the output why ?

I make one factory like this

.factory('abc',function($http){

  return{
    loadData:function(successCallback,errorCallbak){
      return $http.get('data.json').success(successCallback).error(errorCallbak)
    }

  }


})

I used resolve function like that

resolve: {
        user: function (abc) {
         return abc.loadData

        }
      }

But it not displaying the output in HTML why ?

template: '<b>Welcome {{home.user.name}}!</b>',

Expected output is Welcome Naveen

while calling abc.loadData i don't see you are passing successCallback & errorCallback there and additionally resolve function returns promise object. but here you have used callback, that might be another reason behind it.. — Pankaj Parkar
– Pankaj Parkar, Commented Nov 29, 2015 at 10:57

Pankaj Parkar · Accepted Answer · 2015-11-29 11:23:21Z

Resolve function should always return a promise, as I said in my comments. So instead of using callbacks you should return promiseobjectfrom theabcserviceloadData` function.

So for converting your service loadData function to promise you need to change .success & .error function to .then function, which returns a promise object ($http.get method returns promise)like .then(successCallback, errorCallbak).

Factory

.factory('abc', function($http) {
  return {
    loadData: function(successCallback, errorCallbak) {
      //returned promise object using `.then` as $http.get function return promise
      return $http.get('data.json').then(successCallback, errorCallbak)
    }
  }
})

Resolve

resolve: {
    user: function(abc) {
      return abc.loadData(success, error);

      function success(res) {
        console.log(res)
        return res.data;
      }

      function error(res) {
        return []; // or whatever default data, maybe {}
      }

    }
}

Demo Plunkr

Zohaib Ijaz · Accepted Answer · 2015-11-29 11:22:11Z

0

You have to provide success and failure callbacks

http://plnkr.co/edit/HBDMMb7CWAN9BXTDz6fb?p=preview

resolve: {
    user: function (abc) {
     return abc.loadData(success, error);
     function success (res) {
       return res.data;
     } 
     function error (res) {
       return []; // or whatever default data, maybe {}
     } 

    }
  }

edited Nov 29, 2015 at 11:22

answered Nov 29, 2015 at 11:03

Zohaib Ijaz

23k7 gold badges43 silver badges63 bronze badges

1 Comment

Zohaib Ijaz Over a year ago

in your plunkr, you missed the data property, so instead of returning res.data, you just returned res

Collectives™ on Stack Overflow

how to read json file before calling controller using resolve?

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related