阅读369 返回首页    go 阿里云 go 技术社区[云栖]


angularJs select绑定的model 取不到值

内容结构         

一.原因分析

二.解决办法(推荐使用第一种方式)

      一.原因分析

      二. 解决办法

         1.由于原型继承的关系,修改父级对象中的someBareValue会同时修改子对象中的值,但反之则不行。

          2.ng-if 以及 ng-repeat 会创建一个子级作用域,如果在这俩个指令中添加了元素,并增加ng-model指令,那么ng-model对应的作用域属于子级作用域,并非controller注入的$scope对应的作用域。

         1.如果将模型对象的某个属性设置为字符串,它会通过引用进行共享,因此在子$scope中修改 属性也会修改父$scope中的这个属性。下面的例子展示了正确的做法:

 <div ng-controller="SomeController">

         {{ someModel.someValue }}

         <button ng-click="someAction()">Communicate to child</button>

         <div ng-controller="ChildController">

         {{ someModel.someValue }}

             <button ng-click="childAction()">Communicate to parent</button>

         </div>

</div>

     angular.module('myApp', [])

     .controller('SomeController', function($scope) {

// 最佳实践,永远使用一个模式 

       $scope.someModel = {

             someValue: 'hello computer'

         }

         $scope.someAction = function() {

             $scope.someModel.someValue = 'hello human, from parent';

}; })

     .controller('ChildController', function($scope) {

         $scope.childAction = function() {

             $scope.someModel.someValue = 'hello human, from child';

         };

}); 

    2.使用父级作用域                            

<select ng-model="$parent.data"  ng-options="item.id as item.name for item in datas">

      <option value="">-- 请选择 --</option>

</select>

最后更新:2017-08-24 17:02:21

  上一篇:go  Tectonic 1.7升级了容器编排平台,提供了新的监控功能并支持微软Azure
  下一篇:go  一文让你读懂全球第三的传感器——霍尔传感器的特性和用途