AngularJS：观察服务属性变化答案

【问题标题】：AngularJS: Watch Service Property ChangesAngularJS：观察服务属性变化
【发布时间】：2018-04-10 17:38:11
【问题描述】：

我正在尝试为我的应用显示一个简单的下载进度。每次下载文件时，都会向用户显示操作系统下载的总数。例如，文件 1/5、2/5、5/5。下载是由使用承诺的 downloadService 完成的，每次成功下载都会增加一个变量。我试图在控制器中显示该数字，但直到现在我都没有成功。我只能显示文件总数（另一个 downloadService 变量）。我尝试直接访问该变量，尝试了 $watch() 并没有。我能够访问该变量的唯一方法是使用 $interval 来检查更改，但这似乎超出了我需要的开销。

这就是我所拥有的......

下载服务：

myApp.service('downloadService', ['$http', function($http)
{
    this.numberOfDownloads = 0;
    this.totalNumberOfDownloads = 0;
    var self = this;

    var downloadService =
    {
        downloadList: function(list)
        {
            self.numberOfDownloads = 0;
            self.totalNumberOfDownloads = list.length;

            var promise = new Promise(function(resolve, reject)
            {
                //(...)

                //update preloader
                downloadService.setDownloadStatus(self.numberOfDownloads);

                //(...)
            })
            .then(function(result)
            {
                return result;
            });

            return promise;
        },

        getDownloadStatus: function()
        {
            return self.numberOfDownloads;
        },

        getTotalNumberOfDownloads: function()
        {
            return self.totalNumberOfDownloads;
        },

        setDownloadStatus: function(value)
        {
            self.numberOfDownloads = value;
        }
    };

    return downloadService;

}]);

预加载器控制器

myApp.controller('preloader', ['$scope', 'downloadService', '$interval', function($scope, downloadService, $interval)
{
    $scope.downloadService = downloadService;

    //doesn't work...
    $scope.$watch(function()
    {
        return downloadService.getDownloadStatus();
    },
    function(value)
    {
        console.log(value);
    }, true);

    //works....
    $interval(function()
    {
        console.log($scope.downloadService.getDownloadStatus());
    }, 1000);

}]);

我在这里做错了什么？我怎样才能做到这一点？

【问题讨论】：

标签： angularjs angularjs-scope angularjs-service angularjs-watch

【解决方案1】：

你试过了吗：

 $scope.$watch(function()
 {
    return $scope.downloadService.getDownloadStatus();
 }); // parenthesis forgotten

【讨论】：