angularjs - 服务数据更改时更新范围值

Question

我的应用程序中有以下服务:

uaInProgressApp.factory('uaProgressService', 
    function(uaApiInterface, $timeout, $rootScope){
        var factory = {};
        factory.taskResource = uaApiInterface.taskResource()
        factory.taskList = [];
        factory.cron = undefined;
        factory.updateTaskList = function() {
            factory.taskResource.query(function(data){
                factory.taskList = data;
                $rootScope.$digest
                console.log(factory.taskList);
            });
            factory.cron = $timeout(factory.updateTaskList, 5000);
        }

        factory.startCron = function () {
            factory.cron = $timeout(factory.updateTaskList, 5000);
        }

        factory.stopCron = function (){
            $timeout.cancel(factory.cron);
        }
        return factory;
});

然后我在 Controller 中使用它，如下所示:

uaInProgressApp.controller('ua.InProgressController',
    function ($scope, $rootScope, $routeParams, uaContext, uaProgressService) {
        uaContext.getSession().then(function(){
            uaContext.appName.set('Testing house');
            uaContext.subAppName.set('In progress');
            uaProgressService.startCron();

            $scope.taskList = uaProgressService.taskList;
        });
    }
);

所以基本上我的服务每 5 秒更新一次 factory.taskList，并将此 factory.taskList 链接到 $scope.taskList。然后我尝试了不同的方法，例如 $apply、$digest 但 factory.taskList 上的更改未反射(reflect)在我的 Controller 和 View $ 中范围.taskList.

它在我的模板中仍然是空的。你知道我如何传播这些变化吗？

Answer 1

虽然使用$watch可以解决问题，但这并不是最有效的解决方案。您可能想要更改在服务中存储数据的方式。

问题是，每次为 taskList 分配新值时，您都会替换与之关联的内存位置，而作用域却停留在旧位置。您可以在 this plunk 中看到这种情况发生。

首次加载 plunk 时，使用 Chrome 拍摄堆快照，单击按钮后，您将看到范围指向的内存位置从未更新，而列表指向不同的内存位置。

您可以通过让服务保存一个包含可能更改的变量的对象(例如 data:{task:[], x:[], z:[]} )。在这种情况下，“数据”永远不应该被更改，但它的任何成员都可以在需要时更改。然后，您将此数据变量传递给作用域，只要您不通过尝试将“数据”分配给其他内容来覆盖它，每当数据内的字段发生更改时，作用域都会知道它并正确更新。

This plunk显示使用上面建议的修复运行的相同示例。在这种情况下不需要使用任何观察者，如果发生 View 上的某些内容未更新，您知道您需要做的就是运行作用域 $apply 来更新 View 。

这样，您就不需要观察者经常比较变量的变化，也不需要在需要观察许多变量的情况下进行丑陋的设置。这种方法的唯一问题是在您的 View (html)上您将拥有“数据”。在以前只有变量名的地方添加前缀。