控制器继承如何在angularjs

时间:2015-09-02 06:27:40

标签: javascript angularjs inheritance

我试图从主控制器继承一些属性但是没有按照我的预期工作。当我在主控制器中更改数据的值时,它也会更新子控制器的值。一旦我专注于子控制器然后开始工作,因为我除外。我在主控制器中有一个计数器,我想存储用户输入的数字,但当用户输入主控制器的计数时,它会改变子控制器的数量。为什么它更新子类。 继承如何在angularjs中起作用

<body ng-app="myapp">
        <div ng-controller="MainController">
        <label>Count for main controller</label>
        <input type="text" ng-model="count">
            <div ng-controller="subController">
            <label> count for sub controller</label>    

                <input type="text" ng-model="count">

            </div>
            {{count}}
        </div>

    </body>


<script>
var myapp=angular.module('myapp',[]);
myapp.controller('MainController',function($scope){
    $scope.count=0;
    //other properties
});

myapp.controller('subController',function($scope){

    //other properties  
});
</script>

1 个答案:

答案 0 :(得分:0)

AngularJS在Controller中使用原型继承,这就是为什么在基类中改变它时它也会在子类中改变的原因。 Child直接从基类访问属性。

当我们专注于子控制器时,它会创建自己的复制属性并与基类中的属性断开连接。没有办法阻止这一点。

我们如何强制更新基本属性作为子类更新属性购买将对象分配给$ scope而不是直接属性。

<body ng-app="myapp">
        <div ng-controller="MainController">
        <label>Count for main controller</label>
        <input type="text" ng-model="val.count">
            <div ng-controller="subController">
            <label> count for sub controller</label>    

                <input type="text" ng-model="val.count">

            </div>
            {{val.count}}
        </div>

    </body>


<script>
var myapp=angular.module('myapp',[]);
myapp.controller('MainController',function($scope){
    $scope.val={count:0}
    //other properties
});

myapp.controller('subController',function($scope){

    //other properties  
});

现在,在更新子属性时,它也会更新父属性并保持连接状态。