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 に答える