javascript - AngularJS - GET 响应无法在 HTML 中显示

Question

我有一个简单的 View ，其中显示了一堆 JSON 数据。我面临的问题是，当我尝试直接从工厂内部显示数据时，会显示数据，但是当通过 $http.get 请求访问时，不会显示相同的数据!正在获取数据，但 JSON 格式在获取请求期间发生了变化。

我的 Controller 代码如下:

angular.module('ngCribs')
.controller('cribsController', function($scope, cribsFactory) {
  $scope.cribs;

  cribsFactory.getCribs().then(function(data) {
    console.log(data);
    $scope.cribs = data;
  }, function(data) {
    console.log(data);
  });

});

我的工厂代码:

angular.module('ngCribs')
.factory('cribsFactory', function($http) {

  function getCribs() {
    return $http.get('data.json');
  }

  return {
    getCribs: getCribs
  };

});

我创建的 JSON 对象:

[
  {
    "type": "Condo",
    "price": 220000,
    "address": "213 Grove Street",
    "description": "Excellent place, really nice"
  },
  {
    "type": "House",
    "price": 410000,
    "address": "7823 Winding Way",
    "description": "Excellent place, really nice and beautiful"
  },
  {
    "type": "Duplex",
    "price": 395000,
    "address": "2834 River Lane",
    "description": "Great, really nice"
  }
]

控制台输出的内容:

这是我到目前为止的进度链接

https://plnkr.co/edit/GTZJC2cCCzE1KfLAD5wF?p=preview

正如您在 plunker 中看到的那样，数据未显示。请帮助和指导我在哪里犯了错误。

谢谢。

Answer 1

在 cribsController.js 中，您将获取整个响应对象，将其更改为 data.data 以仅访问响应数据。

cribsFactory.getCribs().then(function(data) {
  console.log(data);
  $scope.cribs = data.data;
}, function(data) {
  console.log(data);
});