1

请帮助从文件 fruits.json 中提取数据

html:

    <body ng-app="fruitsApp">
        <div ng-controller="fruitsController">
            <ul>
                <li ng-repeat="fruit in fruits">{{fruit.name}}</li>
            </ul>
        </div>
    </body>

js：

var fruitsApp = angular.module('fruitsApp', [])

fruitsApp.factory('fruitsFactory', function($http) {
  return {
          $http.get('fruits.json').success(callback);
      }
  };
});

fruitsApp.controller('fruitsController', function($scope, fruitsFactory) {
  fruitsFactory.getFruitsAsync(function(results) {
      $scope.fruits = results.fruits;
  });
});

水果.json：

[
    {
        "id": 1, 
        "name": "qwerty", 
        "date": "12.11.2012", 
        "teaser": "1Вас научат пользоваться им, дадут советы по эксплуатации и покажут возможности того, что Вы приобрели.", 
        "body": "Вас научат пользоваться им, дадут советы по эксплуатации и покажут возможносто"
    }]

虱子演示： http: //prozaik.16mb.com/angular/remote_data_2/

4

2 回答 2

2

您的工厂声明中有 1 个错误。没有方法getFruitsAsync（您试图在控制器中使用）。在 return {} 中将其声明为 property = function。

2个错误：你没有字段'fruits'作为响应，你的响应是数组，所以$scope.fruits = results.fruits;应该是$scope.fruits = results;

于 2013-09-13T10:22:24.047 回答
1

您的代码应该是这样的（未经测试）：

var fruitsApp = angular.module('fruitsApp', [])

fruitsApp.factory('fruitsFactory', function($http) {
  return {
          getFruitsAsync: function(callback) {
              $http.get('fruits.json').success(callback);
          }
      }
  };
});

fruitsApp.controller('fruitsController', function($scope, fruitsFactory) {
  fruitsFactory.getFruitsAsync(function(results) {
      $scope.fruits = results;
  });
});
于 2013-09-13T10:33:06.553 回答