Question

如何从另一个模块的$ http.success（）更新一个模块的$ scope成员？

这将是一个难以解释的问题，所以我会尽我所能。

我有两个模块HeaderApp和ContentApp。从本质上讲，HeaderApp控制网页应用中的面包屑和导航，ContentApp是“内容”，如果愿意的话。

由于我不想深入了解原因，ContentApp必须每30秒左右刷新一次，以保持信息的最新状态。

这些模块几乎完全相互独立，除了每次ContentApp刷新其数据时，需要在标题中更新refresh_time时间戳。

以下是我尝试过的一种变体：

HTML

<div ng-app="HeaderApp">
    <div ng-controller="Header">
        <span> Updated: {{refresh_time}} </span>
    </div>
</div>

<div ng-app="ContentApp">
    <div ng-controller="Content">
        <div ng-repeat="row in data"> {{row.content}} </div>
    </div>
</div>

javascript

var HeaderApp = angular.module("HeaderApp", [])
.controller("Header", ['$scope', function($scope) {
    $scope.refresh_time = new Date().toString();
    window.update_refresh_time = function() {
        $scope.refresh_time = new Date().toString();
        $scope.$apply(); //this is throwing an error in console
    }
}]);

var ContentApp = angular.module("ContentApp", [])
.controller("Content", ['$scope', '$http', '$timeout', function($scope,$http,$timeout) {
    (function repeatMe() {

        $http(...)
        .success(function(data) {

            $scope.data = data;
            window.update_refresh_time();
            $timeout(repeatMe, 30000);

        }).error(...);
    })();
}]);

//manual bootstrapping...
angular.element(document).ready(function () {
    angular.bootstrap(document, ['HeaderApp', 'BUOverviewApp']);
});

我尝试过的其他变体（在阅读SO上的其他帖子后）包括通过factory并使用angular.module("ContentApp", ["HeaderApp"])在模块之间共享$rootScope服务。

当我检查javascript控制台时，我得到三个look like this的连续错误。我阅读了整个页面并没有多大意义。当我阅读有关使用$apply()的适当时间的其他评论时，我觉得在任何时候你都会发现already in progress错误，理论上从一开始就不需要调用它。

Answer 1

使用$rootScope.$on和$rootScope.$broadcast，我认为这里不需要apply()，如果不应该使用它会触发错误。

var HeaderApp = angular.module("HeaderApp", [])
.controller("Header", ['$scope', '$rootScope', function($scope, $rootScope) {
    $scope.refresh_time = new Date().toString();
    $rootScope.$on("refresh_time", function() {
        $scope.refresh_time = new Date().toString();
    });
}]);

var ContentApp = angular.module("ContentApp", [])
.controller("Content", ['$scope', '$rootScope', '$http', '$timeout', function($scope,$rootScope,$http,$timeout) {
    (function repeatMe() {

        $http(...)
        .success(function(data) {

            $scope.data = data;
            $rootScope.$broadcast("refresh_time");
            $timeout(repeatMe, 30000);

        }).error(...);
    })();
}]);

Answer 2

您是否尝试过$rootScope.broadcast()？

$ http范围内不同模块的$ scope更新

如何从另一个模块的$ http.success（）更新一个模块的$ scope成员？

2 个答案: