我有两个像这样的控制器,
app.controller('ParentMenuController',
function ($scope,MenuService) {
$scope.contentLoaded = false;
$scope.showButton = false;
$scope.showButton = MenuService.getStatus();
});
管理员二:
app.controller('ChildMenuController',
function ($scope,MenuService) {
MenuService.setStatus(true);
});
服务:app.factory('MenuService', function ($q,$http) {
var status= false;
var setStatus=function(newObj){
status=newObj;
};
var getStatus=function(){
return status;
};
return {
getStatus:getStatus,
setStatus:setStatus
};
});
我无法将状态设置为true,但下面一行代码根本没有执行,因此状态始终为false。
$scope.showButton = MenuService.getStatus();
按钮点击或任何动作从用户i可以触发事件,但我的要求是,而页面加载,按钮不应该是可见的。当childMenu控制器执行时,父控制器按钮应该是可见的。我不想使用$broadcast,因为它需要$rootscope。
注意:我的控制器和html有数百行。我只是粘贴了这个功能所需的代码。ChildMenuController(childMenu.html)和ParentMenuController(parentMenu.html)有独立的html。
美元范围。showButton在ChildMenucontroller中不可用。这两个html都被用作指令。主html为index.html.
查看下面的示例:
http://plnkr.co/edit/TepAZGOAZZzQgjUdSpVF?p =
预览您需要使用包装器对象,以便它的属性被更改,而不是主对象。
app.controller('ParentMenuController',
function ($scope,MenuService) {
$scope.contentLoaded = false;
$scope.showButton = MenuService.getStatus();
});
app.controller('ChildMenuController',
function ($scope,MenuService) {
MenuService.setStatus(true);
});
app.factory('MenuService', function ($q,$http) {
var status= {value:false};
var setStatus=function(newObj){
status.value=newObj;
};
var getStatus=function(){
return status;
};
return {
getStatus:getStatus,
setStatus:setStatus
};
});
它和你的代码完全一样,但是state现在是一个带有value属性的对象。状态对象总是相同的,这样当服务中的值发生变化时,这些变化就会传播到曾经请求过该对象的每个人。
实际上你的服务正在被调用,这段代码正在执行
$scope.showButton = MenuService.getStatus();
但是一旦你的child controller
被加载,你只是设置状态,但为了显示按钮,你应该在设置后获取状态像这样,
app.controller('ChildMenuController', function($scope, MenuService) {
MenuService.setStatus(true);
$scope.$parent.showButton = MenuService.getStatus();
});
这将设置按钮为true,它将被显示。
我已经用你的代码做了一个样本,请看看它
演示