AngularJS - 如何强制更新范围（数组项的承诺）

Question

我在 Angular 中创建了一个如下所示的控制器（为简洁而编辑）：

function AppCtrl($scope, $http, $location, $dataService) {
    $scope.projects = $dataService.data.projects;
}

从我的$dataService 服务中正确加载$scope.projects 承诺。

app.service('$dataService', function($q, $http, $location, $rootScope) {
    var dataService = this; //Provides access 'this' inside functions below
    var projectsDeferred = $q.defer();

    $http.get('/api').success(function(data, status, headers, config) {
        projectsDeferred.resolve(data.projects);
    }).error(function(err) {
        projectsDeferred.reject(err);
    });

    this.data = {projects: projectsDeferred.promise};

    //UPDATE FUNCTION
    function updateObjectInArray(array, object, newData) {
        for(i in array) {
            if(array[i] == object) {
                if(newData != undefined) {
                    array[i] = newData;
                } else {
                    return array[i];
                }
            }
        }
        return undefined;
    }


    this.updateProject = function(project, updateData) {
        $http.put('/api/projects/' + project._id, updateData)
            .success(function(data, status, headers, config) {
            updateObjectInArray(dataService.data.projects.$$v, project, data);
        }).error(function(data, status, headers, config) {});
    };

});

我创建了另一个看起来像这样的控制器，它根据当前 URL 从项目数组中选择一个项目：

function ProjectCtrl($scope, $route) {
    //Getting the current project from the array of projects
    $scope.project = $scope.projects.then(function(projects) {
        for(i in projects) {
            if(projects[i]._id == $route.current.params.projectId) {
                return projects[i];
            }
        }
    });
}

当我尝试运行我的updateObjectInArray() 函数时（在我的$http.put() 请求成功时），我在AppCtrl 中的$scope.projects 已正确更新（项目数组）但我在@987654331 中的$scope.project @ 已未更新。我可以在updateObjectInArray() 函数中记录array[i]，它会准确记录我的期望，我可以在AppCtrl 中记录$scope.projects，它会相应更新，但是当我尝试在我的@ 中记录$scope.project 987654337@ 控制器，它没有相应地更新。

我认为原因是因为我在更新updateObjectInArray() 中的array[i] 对象后必须调用$rootScope.$apply() 或$rootScope.$digest()，但是，我得到$digest is already in progress 的错误。

我需要做些什么来确保数组中的$scope.project 项目在我的ProjectCtrl 中得到更新？我需要为它解决一个新的承诺吗？

Answer 1

一旦projects 被加载，您将使用数组projects[i] 中的一项，理论上假设它是内存中的对象0x1。问题是当一个新项目被加载时（假设0x2），并且您更新了数组，您正在更改驻留在数组位置的对象（0x1），但$scope.project 仍然引用现在废弃的对象0x1。不能只在数组中改，必须修改，所以不需要重新绑定$scope.project变量。

最好的解决方案是更改 array[i] = newData 到 angular.extend(array[i], newData)。这样，您只需更改 array[i] 的所有属性，并且当您的 $scope.project 指向内存中的同一对象时，它将被更新。

无论如何，我也相信你可能想改变 if(array[i] == object) { 到 if(array[i]._id === object._id) { 和你的平等比较（==） 严格相等比较 (===)。这个if 更适合您的事业，因为新创建的对象与旧对象不同。

Answer 2

您是否在绑定中使用$scope.projects？还是代码中的其他地方？

因为你正在返回而询问，并且承诺永远不会被它的结果改变，尽管你可以将承诺直接绑定到期望它的内容的 HTML。发生这种情况是因为在内部，Angular 似乎在关注它的结果。

因此，如果您在其他地方使用此变量，则需要使用$q.when($scope.projects)。您将获得一个新的承诺，如果它已经解决，它将立即解决。