输入新数据时，angularjs ng-repeat不更新视图

Question

我有一项服务，它将调用服务器并返回数据。 我将服务绑定到范围上的变量。

例：

• 将服务设为DataModelService
• 在控制器中： $scope.data = DataModelService
• 在视图中<div ng-repeat="value in data.persons">{{value.name}}</div>

我的代码：

This is how my code looks like:

/**DataModelService**/
factory('DataModelService', [
    'DataService',
    function (DataService) {
        var service;
        service = {
            changeState: function (params) {
                DataService.changePersonState(params)
                    .then(function (response) {
                        service.loadData(response.data);
                    });
            },
            loadData: function (responseData) {
                service.persons = responseData.persons;
            }
        }
        return service;
    }

]);
/**DataService**/
factory('DataService', ['$http',
    function ($http) {
        return {
            changePersonState: function (params) {
                return $http.post("url", params);
            }
        }
    }
]);


/**DataController**/
.controller('DataController', ['DataModelService',
    function (DataModelService) {
        $scope.data = DataModelService;
    }
]);

/ 查看 /

<div ng-repeat = "person in data.persons" >{{person.name}} </div>

在视图上，我正在对数据中的键进行ng-repeat，即ng-repeat =“ value.data.persons”，并且我还可以选择将人员的状态更改为活动或不活动，因此无论何时我进行更改在此状态下，将调用发送到服务器，并将数据设置到服务中，并将其绑定到视图时，它应自动更新数据。 但是在我的情况下，ng-repeat不是删除旧数据，而是将新数据附加到旧数据。

Answer 1

对我来说，将promise回调（ then ）写入服务不是一个好的方法。 因为在您的情况下， DataModelService返回数据会有些延迟，但不能保证。 而且我们不知道什么时候。

因此，可以使用其他方法来添加基本的$timeout并从服务中获取数据。

所以我的建议是演示

和您的固定示例： Demo2

如果我们以您的示例为例，它应该像：

JS

var fessmodule = angular.module('myModule', ['ngResource']);

fessmodule.controller('fessCntrl', function ($scope, DataModelService, $timeout) {

    $scope.alertSwap = function () {       

        DataModelService.changeState('ff');

        $timeout(function(){
         $scope.data = DataModelService.getResponse();
        }, 10);       
    }

});

fessmodule.$inject = ['$scope', 'Data', '$timeout'];


/**DataModelService**/
fessmodule.factory('DataModelService', [ 'DataService',function (DataService) {
     var value = [];

    var service = {
        changeState: function (params) {

           DataService.changePersonState(params)
                .then(function (response) {                   
                   value = response.persons;                  
            });
        },
        getResponse : function(){
           return value;
        }
    }
    return service;
}

]);
/**DataService**/
fessmodule.factory('DataService', ['$q',function ($q) {
    var data = {        // dummy 
        persons: [{
            name: "Bob"
        }, {
            name: "Mark"
        }, {
            name: "Kelly"
        }]
    };

    var factory = {
        changePersonState: function (selectedSubject) {
            var deferred = $q.defer();
            deferred.resolve(data);
            return deferred.promise;
        }
    }

    return factory;

} //function
]);