在嵌套的Angularjs控制器中使用ng-model [英] Use ng-model in nested Angularjs controller

问题描述

我在angularjs中有两个嵌套的控制器，并且想在内部控制器中使用外部的ng-model.假设

I have two nested controller in angularjs, and want to use ng-model from outer in inner controller. Suppose this

<div ng-controller='outController'>
    // data.Name : from outer controller
    <div ng-controller='innerController'>
         <input type="text" ng-model='name' ng-init='name=data.Name'>
         {{data.Name}} // display this scope value
    </div>
 </div> 

data.Name值显示在html页面中，但未绑定到名称ng-model. 如何将此值绑定到内部ng-model?

data.Name value display in html page but not bind to name ng-model. How to bind this value to inner ng-model?

推荐答案

在这种情况下，您应遵循点规则，以便允许您使用

You should follow dot rule in this case, so that will allow you to access the parent scope inside the child scope using prototypal inheritance. For using this approach you need to have an object declared in your parent controller like here it should be declared in outController then the inner controller will not create a new one, it will use the existing one using prototypal inheritance

标记

<div ng-controller='outController'>
    // data.Name : from outer controller
  <div ng-controller='innerController'>
        <input type="text" ng-model='data.Name'>
  </div>
</div>

代码

app.controller('outController', function($scope){
   $scope.data = {};

   //..other code here ..//

})

这篇关于在嵌套的Angularjs控制器中使用ng-model的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！