我正在尝试在 ng-repeat 中动态创建指令。我有一个directive-writer
创建许多其他指令但directive-writer
似乎没有输出指令属性的指令。所以第二组指令永远不会被渲染。
有关完整演示,请参阅此 Plunker。
简而言之,我有这个指令标签:
<div ng-repeat="dir in directives" directive-writer
directive-text="{{ dir.text }}" directive-type="{{ dir.directive }}"></div>
范围数据:
$scope.directives = [
{ directive: 'one', text: 'I am One' },
{ directive: 'two', text: 'I am Two' },
{ directive: 'three', text: 'I am Three' }
];
指令定义:
.directive('directiveWriter', function() {
return {
restrict: 'A',
compile: function(tElement, tAttrs) {
tElement.html('<div say="' + tAttrs.directiveText + '" '
+ tAttrs.directiveType + '>' + tAttrs.directiveType + '</div>');
}
};
还有 3 个类似的指令:
.directive('one', function() {
return {
restrict: 'A',
replace: true,
template: '<h3 class="one"></h3>',
compile: function(tElement, tAttrs) {
tElement.text('One says, ' + tAttrs.say);
}
};
问题是directiveWriter
不会将tAttrs.directiveType
值作为属性仅作为文本写出......
所以渲染的 HTML 是:
<div say="I am One" {{ dir.directive }} class="ng-binding">one</div>
其中“三”在 div 内呈现为文本没问题,但从不呈现为属性。
我不明白:
- 为什么文本“三”可以作为文本绑定在 div 内,但不能作为属性。
- 为什么类设置为“ng-binding”。