Question

不知道我在这个设置中有什么错误只是在json中显示书籍，我认为可能是视图或控制器可能是错误的，但我不确定。谢谢你的帮助。

<div class="book col" ng-repeat="book in myBooks">
     <h3 class="title">{{book.title}}</h3>
     <p class="author">{{book.author}}</p>
  </div>

services.js

app.factory('books', ['$http', function($http) {
  return $http.get('books.json')
    .success(function(data) {
        return data;
    })
    .error(function(err) {
        return err;
  });
}]);

books.json

    {
   "per_page":20,
   "page":1,
   "total_pages":1468,
   "total_results":29346,
   "books":[
      {
         "uuid":"235b68e4-5b16-4a25-b731-45c7e67c351e",
         "id":98024,
         "title":null,
         "author":null,
         "language":null,
         "createtime":"2016-05-19T13:09:40.963+00:00"
      },
      {
         "uuid":"5e87daca-e87b-4324-a652-e06d5349bd82",
         "id":98055,
         "title":null,
         "author":null,
         "language":null,
         "createtime":"2016-05-23T15:50:11.777+00:00"
      }

Controller.js

app.controller('BookshelfController', ['$scope', 'books',  function($scope, books) {
    books.success(function(data) {
    $scope.myBooks = data;
  });
}]);

Answer 1

从你的工厂返回一个包含你的函数的对象，调用它会返回$http.get()的结果

app.factory('books', ['$http', function($http) {
    return {
         getBooks: function() {
            return $http.get('books.json');
         }
    };
}]);

由于$http.get会返回Promise对象，因此在您的控制器中使用then来获取响应的结果。

app.controller('BookshelfController', ['$scope', 'books',  function($scope, books) {
    books.getBooks().then(function (data) {
        $scope.myBooks = data;
    }, function (err) {
        console.log(err);
    });
}]);

同时检查url是否正确。

Angular不从外部json加载数据

1 个答案: