4

directiveFoo属性によってインスタンス化されたAngularJS ディレクティブがあります。

<div directiveFoo></div>

常に別のディレクティブをインスタンス化する必要directiveFooがあります。たとえば、テンプレートは次のとおりです。

<div directiveBar="123"></div>

私の質問はこれです-無駄なノードをすべて作成せずにこれを行うことは可能ですか? ディレクティブに追加したいのですreplaceが、吹き飛ばされますdirectiveFoo

私が最終的に欲しいのは:

<div directiveFoo directiveBar="123"></div>

コントローラーを2つ付けた状態。

これは簡単な例です。私は防止しようとしています:

<div directiveA>
    <div directiveB>
        <div directiveC="123">
            <div directiveD></div>
        </div>
    </div>
</div>

ネストされたすべての DOM ノードが本当に必要ない場合

4

1 に答える 1

3

しかし、それはディレクティブFooを吹き飛ばします

すべきではありません。「置換プロセスにより、すべての属性/クラスが古い要素から新しい要素に移行されます。」 --ディレクティブ doc

属性が移行directive-fooされるため、生成された HTML に表示されるはずです。

app.directive('directiveFoo', function() {
    return {
        template: '<div directive-bar="123">bar</div>',
        replace: true,
    }
});

上記のディレクティブにより、次の HTML が生成されます (Chrome でテスト済み)。

<div directive-bar="123" directive-foo>bar</div>

Fiddle.

フィドルでは、各ディレクティブのコントローラーも作成します(あなたがそれを望んでいたと述べたので)、のコントローラーにdirective-barアクセスできることを示しますdirective-foo

(テンプレートにテキストとして入れbarたのは、右クリックして「要素の検査」を選択しやすくするためです)。

于 2013-06-02T01:47:29.117 に答える