javascript - 在 Angular 服务/ Controller 中实现安全 $apply 的最佳方法

Question

我在我的 Angular WebApp 中使用 socket.io 客户端。我将其包装在一项服务中，但这可能不一定令人感兴趣。但是，由于传入数据与使用该服务的 Controller 处于不同的范围内，因此我总是必须调用 $scope.$apply。更糟糕的是，我发现在某些情况下(在连接/重新连接期间)我必须使用 safeApply，如 here 所述。 .

我知道这是一个 Angular Anti-Pattern ，但是我看不出解决这个问题的方法。

是否有解决此问题的通用方法(最好在服务内部)，不会用大量 $scope.$apply/safeApply 污染 Controller ？

BR, 丹尼尔

这里还有一些代码，可以工作，但不是很好:

angular.module('mean')
    .controller('ConnectionStateController', function ($scope) {
        $scope.safeApply = function (fn) {
            var phase = this.$root.$$phase;
            if (phase == '$apply' || phase == '$digest') {
                if (fn && (typeof (fn) === 'function')) {
                    fn();
                }
            } else {
                this.$apply(fn);
            }
        };

        var socket = io.connect('http://localhost:3000');
        $scope.message = 'Not connected';
        socket.on('connect', function () {
            $scope.safeApply(function () {
                $scope.message = "Connected";
            });
        });
    });

Answer 1

在您的情况下，您知道 socket.io 操作总是将异步运行，这使它成为 valid place to use $scope.$apply (towards the bottom of the page) .

我建议不要使用safeApply 并显式调用$scope.$apply。使用 safeApply 将掩盖实现中的真正错误。此外，如果您将代码包装在服务中，则可以在服务中注入(inject) $rootScope 并调用 $rootScope.$apply 中的异步函数。这样你就不需要在每个 Controller 中调用 $scope.$apply。