离子.从JSON文件中的数据返回工厂

Fra*_*ser 1 angularjs angular-http ionic-framework

我正在玩Ionic示例项目,并且正在寻找一种从json文件中提取数据的方法,而不仅仅是项目中的标准数组.

我已经成功修改了services.js以从JSON中获取数据,但我的模板没有获取数据.我假设这是因为它在JSON的http请求完成之前执行.

我需要做些什么来完成这项工作?

........
.factory('People', function($http) {
  // Might use a resource here that returns a JSON array
  var people = $http.get('../data/peopleData.json').success(function(response){
    console.log(response.people); //the data is correctly logged
    return response.people;
  });

  // var people = [{
  //   id: 0,
  //   name: 'Kassiopi'
  // }, {
  //   id: 1,
  //   name: 'Imerola Bay'
  // }];
  //original and works great
return {
    all: function() {
      return people;
    },

    get: function(personId) {
      for (var i = 0; i < people.length; i++) {
        if (people[i].id === parseInt(people)) {
          return people[i];
        }
      }
      return null;
    }
  };
Run Code Online (Sandbox Code Playgroud)

在控制器中:

$scope.people = People.all();
Run Code Online (Sandbox Code Playgroud)

Mud*_*jaz 5

您没有进入控制器,因为在$scope.people = People.all();您执行异步调用时执行后正在获取数据 .所以使用延迟$q服务角度.

.factory('People', function($http, $q) {
     var people = function () {
        var deffered = $q.defer();
        $http({
          method: 'GET',
          url: '../data/peopleData.json'
        }).success(function (data, status, headers, config) {
          deffered.resolve(data);
        }).error(function (data, status, headers, config) {
          deffered.reject(status);
        });

        return deffered.promise;
      };
Run Code Online (Sandbox Code Playgroud)

并改变工厂回报

  return {
    all: people,
Run Code Online (Sandbox Code Playgroud)

现在people将在控制器中返回您的承诺,从中您可以通过这种方式获取数据

 var peoplePromise =  People.all();
 peoplePromise.then(function(response){
  $scope.people = response; //assign data here to your $scope object
},function(error){
  console.log(error);
})
Run Code Online (Sandbox Code Playgroud)