Question

情境： 我创建了一个文档服务，从json文件

加载所有文档

myModule.factory('DocumentService', ['$http', '$resource', function ($http,$resource) {

var docArray = [];        
$http.get('/Scripts/json/documents.json').then(function (response) {
    docArray = response.data;
});

_getDocuments = function () {      
     return docArray;      
}
return {
    getDocuments: _getDocuments        
}
}]);

我创建了一个Document文档控制器，它从文档服务中获取值

myModule.controller('HomeController', ['$scope', 'DocumentService','$http', function ($scope, docservice, $http) {

$scope.documents = docservice.getDocuments();
}]);

和html

<div class="btn btn-primary col-xs-12 padding-rm-bs" data-toggle="button" ng-repeat="document in documents" ng-click="changePrimaryRightPanel(document)">
            <div class="col-xs-10 ">
                <ul class="list-inline pull-left">
                    <li>
                        <span ng-show="document.hide==true" >{{document.id}}</span>
                        <img ng-src="{{document.status |DocStatusFilter}}" width="12" height="16"></li>
                    <li>{{document.name}}</li>
                </ul>
                <ul class="list-inline pull-right">
                    <li></li>
                </ul>
            </div>
            <div class="col-xs-2 ">
                <ul class="list-inline pull-right text-right">
                    <li>{{document.size | DocSizeFilter}} </li>
                    <li><span title="{{document.lastModified}}">{{document.lastModified}} </span> </li>
                </ul>
            </div>
        </div>

Documents.json

[
        {
            "id": 1,
            "status": 1,
            "name": "Draft Contract",
            "size": 2306867.2,
            "lastModified": "1-1-2013"
        }
    ]

问题： $ scope.documents没有填充结果。

但如果我在控制器中进行更改并在控制器中移动服务功能，那么它可以正常工作

$http.get('/Scripts/json/documents.json').
    then(function (response) {
        $scope.documents = response.data;
    });

我该如何解决这个问题。基本上我希望我的文档服务获取，更新，删除，添加文档，并希望我的控制器只是调用文档服务的方法

这种做事的方式还是我需要用承诺来污染我的控制器？

可以指导一下这是处理工厂和控制器及其沟通的最佳实践任何帮助将不胜感激

Answer 1

我猜你填充$scope.documents之后你的ajax请求就结束了。

您可能应该使用此代码段之后的承诺：

app.factory('myService', function($http) {
  var myService = {
    async: function() {
      // $http returns a promise, which has a then function, which also returns a promise
      var promise = $http.get('test.json').then(function (response) {
        // The then function here is an opportunity to modify the response
        console.log(response);
        // The return value gets picked up by the then in the controller.
        return response.data;
      });
      // Return the promise to the controller
      return promise;
    }
  };
  return myService;
});

app.controller('MainCtrl', function( myService,$scope) {
  // Call the async method and then do stuff with what is returned inside our own then function
  myService.async().then(function(d) {
    $scope.data = d;
  });
});

Source

Angularjs：ajax结果未加载到控制器中

1 个答案: