angularjs – Angular指令:绑定到父作用域中的变量
发布时间:2020-12-17 09:56:57 所属栏目:安全 来源:网络整理
导读:角度指令演示: jsfiddle div ng-app="myApp"script function Contrl($scope){ $scope.parval = 0; $scope.items = [ {id: 1,text: '1'},{id: 2,text: '2'},{id: 3,text: '3'} ]; }/scriptdiv ng-controller="Contrl" A: input type="radio" value="1" ng-mo
角度指令演示:
jsfiddle <div ng-app="myApp"> <script> function Contrl($scope){ $scope.parval = 0; $scope.items = [ {id: 1,text: '1'},{id: 2,text: '2'},{id: 3,text: '3'} ]; } </script> <div ng-controller="Contrl"> A: <input type="radio" value="1" ng-model="parval">1</input> <input type="radio" value="2" ng-model="parval">2</input> <input type="radio" value="3" ng-model="parval">3</input> <item parval="parval" items="items"></item> </div> angular.module('myApp',[]) .directive('item',function() { return { restrict: 'E',replace: true,scope: { parval: '=',items: '=' },template: '<div>' + 'B: <span ng-repeat="i in items">' + '<input value="{{i.id}}" type="radio" ng-model="parval">{{i.text}}</input> ' + '</span>' + '</div>' }; }); 现在: 点击B1 – > A1没变 我想要: 点击B1 – > A1选中了 怎么样?
你正在使用原语,你应该避免使用文字表示法,因为ng-repeat创建了一个新的范围.以下代码将解决您的问题
<div ng-controller="Contrl"> A: <input type="radio" value="1" ng-model="parval.value">1</input> <input type="radio" value="2" ng-model="parval.value">2</input> <input type="radio" value="3" ng-model="parval.value">3</input> <item parval="parval" items="items"></item> </div> <script> function Contrl($scope) { $scope.parval = { value: 0 }; $scope.items = [ { id: 1,text: '1' },{ id: 2,text: '2' },{ id: 3,text: '3' } ]; } angular.module('myApp',function () { return { restrict: 'E',template: '<div>' + 'B: <span ng-repeat="i in items">' + '<input value="{{i.id}}" type="radio" ng-model="parval.value">{{i.text}}</input> ' + '</span>' + '</div>' }; }); </script> (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |