Question

＆＃13;

angular.module('testJsonLoadApp')
  .factory('LoadJsonFactory', function($http) {
    var jsonLoad = {
      fetch: function() {
        return $http.get('../../test.json').then(function(data) {
          return data;
        });
      },

    };

    return jsonLoad;
  })
  .controller('MainCtrl', function ($scope, LoadJsonFactory) {
    var a = [];
    LoadJsonFactory.fetch().then(function(items) {
        a = items;
    });
    $scope.data = a;
  });

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div>
  <ul>
    <li ng-repeat="datum in data">{{datum.id}}</li>
  </ul>
</div>

＆＃13;

这是Json文件内容

[{"id": "0","Name": "Items 0", "Description": "Description 0"},
{"id": "1","Name": "Items 1", "Description": "Description 1"},
{"id": "2","Name": "Items 2", "Description": "Description 2"}]

变量＆＃39; a＆＃39;在控制器中没有使用从json文件生成的数组进行更新。但是，如果我使用$ scope变量直接绑定数组，那么它可以工作。

LoadJsonFactory.fetch().then(function(items) {
            $scope.data = items;
        });

以上代码有效。

有没有办法可以将它分配给控制器变量，然后将其绑定到范围变量？

Answer 1

此调用是异步

LoadJsonFactory.fetch().then(function(items) {
    a = items;
});

这在呼叫完成之前执行

$scope.data = a;

所以不，你不能这样做。在分配到a

时，$scope.data将始终为空

如果它适合你，你可以这样做，这与你的工作相同，只是更清楚。

LoadJsonFactory.fetch().then(onFetch);


function onFetch(data) {
    $scope.data = data;
}

Answer 2

您可以将服务响应LoadJsonFactory分配给服务中的变量，而不是控制器中的变量，然后从任何控制器中调用它。

例如：

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

var jsonResponse = [];

return {
    fetch: function() {
       return $http.get('../../test.json').then(function(data) {
       jsonResponse = data;
     });
    },
    getResponseResult: function() {
      return jsonResponse;
    }
   }
 })

Answer 3

您的代码存在的问题是LoadJsonFactory的$ http调用是异步的。调用LoadJsonFactory后，您的RDD.takeOrdered(15, lambda (a, b, c, d): d)会立即运行。

我做了一个快速的傻瓜，说明了这个打开的控制台，看看我的意思。（我还清理了一下LoadJsonFactory，以便更明确地返回一个承诺。）

https://plnkr.co/edit/Ns1iQdvhKT6DXrfjrOjm

在promise的success函数中分配$ scope.data是有效的，因为在那时，promise被解析，并且赋值触发了一个更新双向绑定的摘要。

将数据从json文件中提取到angularjs服务中

3 个答案: