我正在尝试创建一个自定义指令,该指令将用模板替换自身并将其复制text()
到替换的版本。
为什么不使用ng-transclude
?好吧,这是一种矫枉过正,因为指令中没有 HTML,只有我想复制的文本。它还创建了另一个 HTML 元素,这有点浪费。
问题是,在有模板的地方,Angular 会传递模板,$element
而且我不知道有什么方法可以访问原始内容。绑定也不起作用,因为值不在属性内,而是在元素的内容内。
指示:
angular.module('ui', [])
.directive('foo',
function() {
return {
restrict: 'E',
replace: true,
template: '<p>Insert here</p>',
compile: function(element, attrs) {
console.log('compile time text: ' + element.text());
return function($scope, element, attrs) {
console.log('link time text: ' + element.text());
};
}
}
});
用法:
<div ng-app="ui">
<foo>This should be copied</foo>
</div>
小提琴:http: //jsfiddle.net/uefnx/1/