Javascript AngularJs$scope不'；t在工厂上的GET请求后更新

我一直在为一个实验项目尝试AngularJS，我遇到了这个问题。 在我的html中，我想显示项目列表

Index.html

<h1>Some list</h1>
<div ng-controller="datlist">
    <div ng-repeat="item in items">
        <div>Item description: {{item.description}}</div>
        <div>Item name: {{item.name}}</div>
    </div>
</div>

function datlist($scope,$http){
$http({method: 'GET', url: 'http://localhost:61686/getdatlist?format=json', headers: {'Access-Control-Allow-Origin': 'localhost:*'}}).
    success(function(data, status, headers, config) {
        $scope.items=data.itemsToReturn;
        console.log(data);
}).
error(function(data, status, headers, config) {
    console.log("fail");
});

}

这是非常好的工作，我可以得到的项目清单。同时，通过改变我的结构，使用工厂来提出相同的请求，并将其绑定到$scope.items，它就不起作用了。我尝试了$watch的许多变体，但无法让它更新$scope.items。我找到了一些关于$apply的东西，但我真的不知道如何使用它

controllers.js（新的）

任何关于这方面的想法都会很好。 附言：我发现很多帖子都在谈论这个问题，但没有一篇能帮助我得到一个完整的解决方案

---

谢谢

看起来很完美，但是你可以像这样使用

$apply

datModule.controller('datlist', function ($scope, datfactory){
    $scope.$apply(function() {
        $scope.items = datfactory.getlist();
    });
});

---

尝试初始化

$scope.items=[]在控制器上，在调用$http之前

我希望它能帮助您。
这个问题与范围摘要周期无关。您正试图从回调内部直接返回，这是异步不可能的

我建议您要么使用承诺，要么直接返回http承诺

var factory = {};
factory.getlist = function(){
    return $http({method: 'GET', url: 'http://localhost:61686/getdatlist?format=json', headers: {'Access-Control-Allow-Origin': 'localhost:*'}});

}
return factory;

直接返回承诺，并在
factory.getlist（）.success（）处理成功/失败

或者，如果您希望围绕请求包装其他逻辑，请使用您自己的承诺

var datModule = angular.module('datModule',[]);

datModule.controller('datlist', function ($scope, datfactory){
    $scope.items = [];
    datfactory.getlist().then(function(data) { $scope.items = data });
});

datModule.factory('datfactory', function ($http, $q){
    var factory = {};
    factory.getlist = function(){
        var defer = $q.defer();
        $http({method: 'GET', url: 'http://localhost:61686/getdatlist?format=json', headers: {'Access-Control-Allow-Origin': 'localhost:*'}}).
        success(function(data) {
            // alter data if needed
            defer.resolve(data.itemsToReturn);
        }).
        error(function(data, status, headers, config) {
            defer.reject();
        });
        return defer.promise;
    }
    return factory;
});

用手表来做这个有点难看

试试这个：

datModule.factory('datfactory', function ($http, $q){

    this.getlist = function(){            
        return $http.get('http://localhost:61686/getdatlist?format=json',{'Access-Control-Allow-Origin': 'localhost:*'})
            .then(function(response) {
              console.log(response); //I get the correct items, all seems ok here
              return response.data.itemsToReturn;
            });            
    }
    return this;
});

datModule.controller('datlist', function ($scope, datfactory){
    datfactory.getlist()
      .then(function(arrItems){
         $scope.items = arrItems;
       });
});

这就是如何使用承诺来解决异步问题

更新（2015年1月15日）：现在更加时尚
 我认为这个问题的另一个优雅的解决方案可能是-如果您使用其中一个路由库，在我的情况下，它是UI路由器，但也可能是ngRoute，它使您的控制器依赖于承诺的响应，例如，向适当的状态/路由添加resolve属性，在承诺得到解决且数据准备就绪之前，该属性不允许控制器加载，因此在您的配置中：

.state('datpage', {
      url: '/datpage',
      controller: 'DatpageController',
      resolve:{
        datData: function (datfactory) {
            return datDataService.getData("datDataParam");
        }]
      },
      templateUrl: 'views/datpage.html'
    })

并将datData依赖项注入控制器中，您可以将其直接应用于$scope：

.controller('DatpageController', function ($scope,datData) {
$scope.datPageData = datData; ...

这似乎不管用，伙计。无论如何，谢谢你。我在另一个输入上做了一个ng更改，我使用了console.log（$scope.items），但无论如何我都没有被定义。我真的不知道我这个不行我已经试过了。也不行。不管怎样，谢谢你。工作得很有魅力。谢谢你工作得很有魅力。非常感谢。
.controller('DatpageController', function ($scope,datData) {
$scope.datPageData = datData; ...