使用ng-repeat在Angular 1.5.8中放置自定义指令不起作用
我正在使用ng-repat指令在我的HTML中放置自定义指令。使用ng-repeat在Angular 1.5.8中放置自定义指令不起作用
但是,自定义指令不被评估,如果直接在HTML上放置相同的指令,那么它正在工作。
...
<body ng-app="docsSimpleDirective">
<div ng-controller="Controller">
<div>This is a Problem</div>
<!--Here in for loop i want to us the value to call a directive-->
<div ng-repeat="var in arr">
<!--Here i am using directive with restrict: 'C' and this is not expending-->
<span class="{{var}}"></span>
</div>
<!-- here my directive named "direct" is working fine -->
<span class="direct"></span>
</div>
</body>
...
和我的JS代码是
(function(angular) {
'use strict';
angular.module('docsSimpleDirective', [])
.controller('Controller', ['$scope', function($scope) {
$scope.arr = ['direct','indirect'];
}]).directive('direct', function() {
return {
template: 'direct',
restrict: 'C'
};
}).directive('indirect', function() {
return {
template: 'indirect',
restrict: 'C'
};
});
})(window.angular);
我相信有一些编译的问题,我搜索网页,发现$编译可以解决我的目的,但无法实施。
请帮我解决我的问题。
Plunker FPGA实现的相同:https://plnkr.co/edit/lYGg0UkQpNhN5NJx13Zj?p=preview
使用指令作为一类是不好的做法,(因为无法读取) https://github.com/johnpapa/angular-styleguide/blob/master/a1/README.md#restrict-to-elements-and-attributes
然后你传递一个指令为一类,但动态插值这本身是坏的练习(https://docs.angularjs.org/guide/interpolation#known-issues)。插入类名称并呈现该元素,但该指令在插值期间未编译。
从您的指令定义的限制线,并把它们作为属性:
<span indirect></span>
然后在NG-重复循环使用它们,你可以检查,如果VAR =“直接”或“间接”
ng -switch不会解决我的问题,因为实际上我必须遍历一个JSON并且有很大的no。的价值观。我已经想到了摆脱ng-switch的指令,截至目前我已经实现了ng-swich和ng-include指令来解决我的目的。 –
@ Shashank.gupta40与此相同http://*.com/questions/38821980/how-to-write-directive-on-class-in-angular-js这是不可能的。看看$编译的情况下,但你最好重新考虑你正在构建的东西。 – gyc
使用指令这样
<div ng-repeat="var in arr"> <span direct ng-if="var == 'direct'"><span> <span indirect ng-if="var == 'indirect'"><span> <div>
并在控制器中将restrict定义为属性。
.directive('direct', function() { return { template: 'direct', restrict: 'A' };
它不工作,因为当角解析器来''其编译DOM&值评估'{{VAR}}'值,即意思是在DOM编译之后'class'属性值被填满了,这就是为什么指令没有被编译。你可以通过使用'ng-switch' /'ng-if'指令来解决这个问题,在'ng-if' /'ng-switch'中把两个指令'direct'&indendirect和一些'expression'放在一起。 –