0

我有一个 angularJS 应用程序。我有一个带有以下模板和控制器的页面:

<div ng-controller="ParentCtrl">
    <p>{{food}}</p>
    <div ng-controller="ChildCtrl">
        <button ng-click="onBtnClk()">{{buttonTitle}}</button>
    </div>
</div>

两个控制器:

app.controller('ParentCtrl', ParentCtrl);
ParentCtrl.$inject = ['$scope','$rootScope'];
function ParentCtrl($scope,$rootScope) {
    $rootScope.food = "hi"
    $rootScope.$on("UPDATE_PARENT", function(event,msg) {
        $rootScope.food = msg;
        console.log("Witnessed")
    });
}

app.controller('ChildCtrl', ChildCtrl);
ChildCtrl.$inject = ['$scope','$rootScope'];

function ChildCtrl($scope,$rootScope) {
    $scope.buttonTitle="Update Parent"
    $scope.onBtnClk = function() {
        $rootScope.$emit("UPDATE_PARENT","updatedyy");
        console.log($rootScope)
    };
}

所以基本上,我有一个父母和一个孩子控制器;单击子控制器中的按钮会发出带有消息“updatedyy”的事件。这是在父控制器中获取 $on 的,它将 $rootScope.food 的值设置为消息值。

现在我的问题是,是否可以在应用程序的所有实例中看到变量的这种值变化?例如,如果我在浏览器的两个选项卡中打开了应用程序(在 Tomcat 服务器上运行),然后单击按钮 - 是否也可以在另一个选项卡中获得更改的值?

4

0 回答 0