0

我正在尝试创建一个自定义指令,该指令将用模板替换自身并将其复制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/

4

1 回答 1

0

您可以像这样访问由指令包装的innerHTML

var text = element.$$element.context.innerHTML;
于 2013-09-05T13:42:38.300 回答