angularjs – 单选按钮指令不绑定ngModel
发布时间:2020-12-17 17:48:52 所属栏目:安全 来源:网络整理
导读:我正在尝试创建一个通用的radioButton指令,它将从控制器中获取显示选项: cs-radio-field options="gender" ng-model="genderValue"/cs-radio-field 而选项就像 $scope.gender = { label: "Gender",required:true,valueList: [{ text: "Male",value: "yes" }
我正在尝试创建一个通用的radioButton指令,它将从控制器中获取显示选项:
<cs-radio-field options="gender" ng-model="genderValue"></cs-radio-field> 而选项就像 $scope.gender = { label: "Gender",required:true,valueList: [{ text: "Male",value: "yes" },{text:"Female",value:"no"}] }; 该指令定义为: app.directive("csRadioField",function () { var templateHtml = function () { return '<div ng-form="myform">' + '<div class="control-group" class="{{options.class}}">' + '<div class="control-label">{{options.label || "Radio"}} {{ options.required ? "*" : ""}} </div>' + '<div class="controls">' + '<div class="radio" ng-repeat="(key,option) in options.valueList">' + '<label> <input type="radio" name="myfield" ng-value="option.value" ng-model="ngModel" ng-required="options.required" />{{option.text}} </label>' + '</div>' + '<div class="field-validation-error" data-ng-show="myform.myfield.$invalid && myform.myfield.$dirty"> ' + '<div data-ng-show="myform.myfield.$error.required">{{options.label}} is required!!!</div>' + '</div>' + '</div>' + '</div>' + '</div>'; }; return { scope: { options: '=',ngModel: '=' },required: ['ngModel','^form'],restrict: 'E',template: templateHtml,}; }); 但是ngModel在父作用域中没有绑定…主要是因为ng-repeat创建了新的作用域. 怎么解决这个问题? plunker链接:http://plnkr.co/edit/myS5hXwxjoDEqQI2q5Q7?p=preview 解决方法
在模板中尝试此操作:
ng-model="$parent.ngModel" DEMO 你是正确的ng-repeat创建子范围.您实际上绑定到子范围的属性. (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |