我有一个 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 服务器上运行),然后单击按钮 - 是否也可以在另一个选项卡中获得更改的值?