问题描述:因为ng-model
是ng-repeat
动态生成的,ng-model
=”变量”,什么变量,是未知的,所以你无法在$scope."变量"
取到值,就算取到值也是其中一个值。
html:
<div class="form-horizontal"> <div class="modal-header"> <h4 class="modal-title">{{title}}</h4> </div> <div class="modal-body"> <div class="clearfix"> <div class="form-inline margin-top-20"> <button class="btn btn-xs btn-info" ng-click="addMore()">批量新增</button> <button class="btn btn-xs btn-info margin-left-20" ng-click="addOne()">手动新增</button> </div> <table class="table table-bordered table-striped table-center" style="margin-top: 20px; 400px;"> <thead> <tr> <th rowspan="2" class="inner" style="vertical-align: middle !important;">批次号</th> <th rowspan="2" style="vertical-align: middle !important;">是否展示</th> </tr> </thead> <tbody> <tr ng-repeat="(index,tabledata) in channels"> <td ng-bind='tabledata.batch_name'></td> <td> {{$parent.conf[$index]}} <label> <input type="radio" value="1" ng-model="$parent.conf[$index]"> 是 </label> <label> <input type="radio" value="0" ng-model="$parent.conf[$index]"> 否 </label> </td> </tr> </tbody> </table> </div> </div> </div> <div class="modal-footer" style="text-align: center;"> <button class="btn btn-success" type="button" name="submit" ng-click="ok()">保存</button> <button class="btn btn-warning" type="button" ng-click="cancel()">取消</button> </div>
js(局部):
$scope.ok = function() { console.log($scope.conf); $scope.str = ''; $scope.arr = []; angular.forEach($scope.channels,function(value,index,array){ console.log($scope.conf[index]); value.is_view=$scope.conf[index] ; $scope.str = value.id+'_'+value.is_view; $scope.arr.push($scope.str); // console.log(value.is_view); }) console.log($scope.arr) $scope.save(); // $uibModalInstance.close(); };
解决办法:
1、ng-repeat的作用域学习
- ng-repeat会在上一级作用域名中创建一个子作用域;
- 此时如果需要在子作用域中调用父作用域的变量,则可以使用$parent.variableName来调用。
-
ng-repeat中调用和父作用域同名的变量,无$parent前缀则指的是调用的子作用域的变量,就像局部变量一样。
-
ng-repeat中的$index: element in elements 当前element在elements中的下标数。例如第一个element,则$index=0.
2、首先ng-model设置为$parent.conf[$index]
- 用
$parent
的原因是ng-repeat
产生的,他会为每一个input
生成一个子scope
对象,而$parent
表示用父类的scope
,这样我们在JS
文件中才能取到该值 $index
代表的意思是ng-repeat="param in params"
遍历时的下标conf
是我们在js
中的变量名(曾经尝试了不设置这个conf数组,将ng-model设置为$parent[$index],结果导致更改了数据,在js获取不到改变后的值,一直是原来默认的数据)
3、我们在controller
中定义了一个$scope.conf = [];
就是一个数组,刚好通过上面的代码,为该数组添加了元素,然后我们通过scope.conf
刚好把ng-model
的所有元素自动保存了。