在使用angularjs的时候可能会出现通过$scope获取不到通过ng-mode绑定的表单元素的值，这可能是多种原因造成的，笔者遇到的情况大致如下：
代码示例
- template
<div ng-repeat="kind in kinds">
<label class="i-checks">
<input type="radio" ng-model="kind" ng-value="{{ kind.id }}"><i></i> {{ kind.name }}
</label>
</div>
- controller
console.log($scope.kind);
- 当
template中触发了某个事件后执行到controller中的代码时打印出来的$scope.kind在不论单选框是否选中的情况下都是undefined。
问题根源
radio的ng-model位于ng-repeat中，ng-repeat会创建自己的scope，所以在controller中通过$scope.kind获取的并不是ng-repeat中的kind而是全局的，但是全局的kind并没有定义。
解决办法
将template中的ng-model="kind"调整为ng-model="$parent.kind"即可，完整的template代码为：
<div ng-repeat="kind in kinds">
<label class="i-checks">
<input type="radio" ng-model="$parent.kind" ng-value="{{ kind.id }}"><i></i> {{ kind.name }}
</label>
</div>
本文首发于公众号：programmer_cc，转载请注明出处。
微信公众号.jpg
