31

Transclude と隔離されたスコープを持つディレクティブ ( container1) が与えられた場合、ディレクティブがリンクされると、次のスコープが得られます。

Scope 004           <-- scope of the body
    Scope 005       <-- scope of directive container1
    Scope 006       <-- scope of the ng-transclude

私は期待しました:

Scope 004            <-- scope of the body
    Scope 005        <-- scope of the directive
         Scope 006   <-- scope of the ng-transclude

同じディレクティブに分離スコープではなく共有スコープがある場合、期待される結果が得られます。

component1トランスクルードされたコンテンツに、分離されたスコープを持つ別のディレクティブ ( ) が含まれている場合、次のようになるため、これにより問題が発生します。

Scope 004             <-- scope of the body
    Scope 005         <-- scope of the directive
    Scope 006         <-- scope of the ng-transclude
          Scope 007   <-- scope of directive component1

次のようなディレクティブを使用したい:

<container1>
   <component1 data="objectExposedInContainer1"/>
</container1>

しかし、 が正しい範囲にないためcomponent1、それ$scope.dataは機能しません。undefinedobjectExposedInContainer1

2 つの質問があります。

  • ng-transcludeディレクティブに分離スコープがある場合、 のスコープがそのディレクティブのスコープの子ではないのはなぜですか? これはバグですか?
  • バグでない場合、試したように属性を設定しない場合、コンテナディレクティブはどのようにデータをコンテンツに渡すことができますか。

これが機能しないサンプルを次に示します: http://plnkr.co/edit/NDmJiRzTF9e5gw8Buht2?p=preview。Plunker は Anguar でビルドされているため、Batarang でデバッグするのは困難です。コードをローカルにダウンロードすることをお勧めします。共有スコープを使用して機能させるには、コメントアウトしline 10ます。app.js

4

3 に答える 3