Question

我有一个慢慢迁移到AngularJS的jQuery项目。为了保持工作，我逐一介绍AngularJS组件，尝试使用$ rootScope作为事件总线将它们绑定到jQuery处理程序。

这是我从jQuery发送事件的方式：

var el = $('[ng-app="cpmsApp"]')[0];
var rootScope = angular.element(el).scope().$root;
rootScope.$emit('someevent', {'value': 'TR'});

这就是我在控制器中捕获它们的方式：

$rootScope.$on('someevent', function(event, passed_obj) {
    console.log('received event');
    console.log(passed_obj);
    $scope.$apply(function () {
        $scope.countryfilter = passed_obj.value;
    });
});

在从Angular外部捕获事件时这很好用，但是当我尝试从其中发出事件时，我收到错误：

Error: [$rootScope:inprog] http://errors.angularjs.org/1.6.4/$rootScope/inprog?p0=%24apply

根据docs，这意味着不需要显式的$apply。

所以我的问题是，如何查看事件并检查是否使用$apply？有点像：

if(event.from_within_angular) {
    $scope.countryfilter = passed_obj.value;
} else {
    $scope.$apply(function () {
        $scope.countryfilter = passed_obj.value;
    });
}

Answer 1

删除var result = myDbContext.Clubs .Where(club => club.Type = ClubType.CountryClub) .Select(club => new { ClubId = club.Id, ClubName = club.Name, AnonymousMembers = club.Persons .Where(person => person.Name == "John Doe"), }每次触发事件时，countryfilter都会更新

$scope.$apply

Answer 2

我不建议这样做 var rootScope = angular.element(el).scope().$root;因为这不适用于$compileProvider.debugInfoEnabled(false);，建议设置to run AngularJS in production。

作为一种解决方法，您可以使用module run block全局定义广播/发布功能，如：

window.rootScopeUtils = {};
angular.module('cpmsApp').run(['$rootScope', '$timeout', '$window', function ($rootScope, $timeout, $window) {
    $window.rootScopeUtils.$broadcast = function (event, args) {
        $timeout(function() {  //or $rootScope.$applyAsync(function() {});
            $rootScope.$broadcast(event, args);
        });
    };
}]);

在jQuery调用中使用此函数，如window.rootScopeUtils.$broadcast('someevent', {'value': 'TR'})。由于$broadcast包含$timeout，因此会确保$digest。

angularjs - 检查是否需要$ scope。$ apply

2 个答案: