Question

我有一个页面设计，我将主控制器连接到正文：

<body ng-controller="firstController">
    <a href="#">first</a>
    <a href="#/second">second</a>
    <input ng-model="hello" ng-disabled="xyz()">
    <button id="test" ng-disabled="xyz()">test button</button>
    {{hello}}
    <div ng-view></div>
</body>

我将模板默认加载为

 var mainApp = angular.module('mainApp',['ngRoute'])
    .config(['$routeProvider',function($routeProvider){
        $routeProvider.when('/',{
            templateUrl: 'partials/first.html',
            controller: 'firstTemplate'
    })

我的模板是一个复选框：

<div>
    <input type="checkbox" ng-model="check">
</div>

现在我希望按钮#id禁用复选框未选中，现在我想使用工厂，因为这两个在不同的控制器中：

mainApp.factory('clientId',function(){
    var flag = true;
    return flag;
});

mainApp.controller('firstController',['$scope','clientId',function($scope,clientId){
    //$scope.check = true;
    clientId.flag = false;
    $scope.xyz = function(){
        if(clientId){
            return true;
        }else{
            return false;
        }
    }
}])

我能够从工厂获取值，现在我想更新来自不同控制器（模板控制器）的标志值，并且值也应该反映在第一个控制器中，以便可以更新按钮的状态。 / p>

 mainApp.controller('firstTemplate',['$scope','clientId',function($scope,clientId){
}])

如何更新第二个控制器的值并使其反映在第一个控制器中。如果不可能有替代方法来实现这一目标吗？

Answer 1

是的，您可以使用$rootScope

来完成

方式是。

初始化控制器中的$rootScope
从第二个控制器调用第一个控制器范围变量

如果第一个控制器变量为$scope.name

现在您只需在第二个控制器中调用$rootScope而不是$scope

喜欢

$rootScope.name

Answer 2

You can solve this using two ways.
  1. using $rootScope.
  2. using services.

使用$ rootScope：

  <input ng-model="hello" ng-disabled="flagtoDisable">
        <button id="test" ng-disabled="flagtoDisable">test button</button>
        {{hello}}
        <div ng-view></div>

mainApp.controller('firstController',    ['$scope','$rootScope','clientId',function($scope,$rootScope,clientId){
    //$scope.check = true;
    clientId.flag = false;
    $scope.xyz = function(){
        if(clientId){
            return true;
        }else{
            return false;
        }
    }
}])



  mainApp.controller('firstTemplate','$scope','$rootScope','clientId',
    function($scope,$rootScope,clientId){
           $rootScope.flagtoDisable = false;
    if($scope.check == true){
             $rootScope.flagtoDisable = true;
      }

    }])

使用服务：

mainApp.factory('clientId',function(){
    var flag = {
               status:false; };
    return{
      setFlag : funcion() {
           flag.status = true;  
          }  
      getFlag : funcion() {
           return flag;  
          }  

});

mainApp.controller('firstController',['$scope','clientId',function($scope,clientId){
    //$scope.check = true;

    $scope.xyz = function(){
        var flag = clientId.getFlag();
       return flag.status;    
    }
}])

<input ng-model="hello" ng-disabled="xyz()">
    <button id="test" ng-disabled="xyz()">test button</button>
    {{hello}}
    <div ng-view></div>

 mainApp.controller('firstTemplate',['$scope','clientId',function($scope,clientId){
if($scope.check== true){
clientId.setFlag();
}
}])

此代码未经过测试。您可以遵循此方法。

如果在不同的控制器中更新值，如何在一个控制器中更新值？

2 个答案: