angularjs – 如何在div标签的class属性中动态传递自定义指令名
发布时间:2020-12-17 07:50:47 所属栏目:安全 来源:网络整理
导读:我是AngularJS的新手.我已经创建了一个自定义指令用户,我想通过使用变量在class属性中动态调用它. 例如$scope.dirName =“user”; 当我在下面的代码中使用此变量时: div class = {{dirName}}/div 其结果必须显示两个具有指定值的输入字段.但事实并非如此.当
我是AngularJS的新手.我已经创建了一个自定义指令用户,我想通过使用变量在class属性中动态调用它.
例如$scope.dirName =“user”; 当我在下面的代码中使用此变量时: <div class = {{dirName}}></div> 其结果必须显示两个具有指定值的输入字段.但事实并非如此.当我用用户替换{{dirName}}时.它工作正常,意味着两个输入字段显示为指定的值.谁能告诉我,我在做什么错? 这是index.html <div ng-controller = "Ctrl"> <form name = "myForm"> <div class = {{dirName}}></div> <hr> <tt>userName : {{user}}</tt> </form> 这是script.js <pre>var app = angular.module('App',[]); app.controller('Ctrl',function($scope){ $scope.user = {name:'adya',last:'Rajput'}; $scope.dirName = "user"; }); app.directive('user',function(){ return{ restrict:'C',templateUrl:'template.html' }; });</pre> template.html包含: UserName : <input type='text' name='userName' ng-model='user.name' required> LastName : <input type='text' name='lastName' ng-model='user.last'>
遗憾的是,您无法在字符串变量中保存指令名称并在HTML中访问它们.但是,您可以在$scope和
use ng-switch 中的变量中保存字符串以选择正确的指令:
<div ng-switch="dirName"> <div ng-switch-when="ng-user"> <div ng-user></div> </div> <div ng-switch-when="..."> ... </div> </div> 但是,现在使用比ng-user更具描述性的内容来切换可能会更好. 旁注:不要在自己的指令中使用ng-前缀. Angular使用该前缀,以便它不会与其他名称空间冲突.您应该使用自己的前缀作为指令. 更新:有关为什么< div class =“{{dirName}}”>< / div>的更新问题不起作用,因为角度 (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |