Transclude要素とともに、そのスコープもディレクティブに渡すことはできますか？私はこの文に出くわした私は十分な程度<code>Transclude</code>を理解していると感じた

Question

モーメント：そこTransclude要素に取り付けたスコープがあり、それはディレクティブに渡すことができる場合

Transclude allows us to pass in an entire template, including its scope, to a directive. 
Doing so gives us the opportunity to pass in arbitrary content and arbitrary scope to a directive. 

は、この平均値をしていますか？それが本当であれば、ディレクティブテンプレート内でそのスコーププロパティにアクセスすることはできません。

は私が戻って手順のカップルを取り、やろうとしていますかについてのコードで説明しましょう：

JSFiddle Link

私のディレクティブがdirective-boxあるとtransclude: trueが指令定義オブジェクト（DDO）で定義されています。

今トランスクルード

<div ng-controller='TransCtrl'>Inside Transclude Scope : {{name}}</div> 

される要素であり、それはコントローラTransCtrlそれに取り付けられた子供本部があります。

は今、DDOでこれを定義した後に指令レベルからTransCtrlの一部である$scope.nameプロパティにアクセスしようとしています：

scope: { 
     title: '@directiveTitle', 
     name: '=' 
     } 

が可能、このですか？

これは、子スコーププロパティにアクセスしようとする親スコープとよく似ていますが、これはJavaScriptのProtoypical継承で許可されていますか？それとも私が知る必要がある何か他にありますか？

これができない場合は、最初のステートメントは何を意味していますか？

Transclude allows us to pass in an entire template, including its scope, to a directive. 

UPDATE 1：

私の最大の関心事は、コントローラは、Transclude要素に残るべき、まだ我々は指令にその（Transclude要素）スコープを渡すことができる必要があり、その後、指令が消費することができるはずですその範囲は、name from TransCtrl controllerです。

<div ng-controller='TransCtrl'>Inside Transclude Scope : {{name}}</div> 

上記のコード行はそのままです。

私の質問では完全に間違っているかもしれませんが、これが達成できれば教えてください。

Answer 1

これはあなたの質問に答えますか：https://jsfiddle.net/marssfa4/4/？

私は外側に新しいコントローラを作成しました（この指示の中でrootScopeの機能を効果的に置き換えています）。私はコントローラのテンプレートの中にディレクティブのコントローラを設定しました。

htmlをそのスコープとともに、独自のスコープを持つディレクティブにも継承することが可能であることがわかりましたが、それは間違いありません。

HTML：

<div ng-app='myApp' ng-controller="OutsideScope"> 
    <h1>{{externalWorld}}</h1> 
    <div directive-box directive-title='{{directiveWorld}}' name='name'> 
    <div>Inside Transclude Scope : {{name}}</div> 
    </div> 
</div> 

JS（アップデート1を含む）：

angular.module('myApp', []) 
    .directive('directiveBox', function() { 
    return { 
     restrict: 'EA', 
     scope: { 
     title: '@directiveTitle', 
     name: '=' 
     }, 
     transclude: true, 
     template: '<div ng-controller="TransCtrl">\ 
     <h2 class="header">{{ title }}</h2>\ 
       <div class="dirContent">Directive Element</div>\ 
       <div>Outside Transclude Scope : {{name}}</div>\ 
       <div class="content" ng-transclude></div>\ 
      </div>' 
    } 
    }) 
    .controller('TransCtrl', function($scope) { 
    $scope.name = 'Transclude World' 
    }) 
    .controller('OutsideScope', function($scope) { 
    $scope.name = 'External World' 
    }) 
    .run(function($rootScope) { 
    $rootScope.externalWorld = 'External World', 
     $rootScope.directiveWorld = 'Here comes directive' 
    }); 

UPDATE 1：JSFIDDLE

scope: falseが誤ったように、私は、元のスコープ宣言を復元。

あなたのコメントが正しく理解されていれば、コントローラーを要素の上に残して、その要素内に{{name}}が残っていて、その直下のコントローラーを無視し、コントローラーの親（つまりディレクティブの）スコープとして使用します。

私はテンプレートディレクティブ内にコントローラを配置したのは、それがディレクティブのスコープを制限する唯一の方法であり、ディレクティブの非透過要素ではないためです。コントローラに要素を明示的に配置している場合、ディレクティブ内に別のスコープが含まれているかどうかにかかわらず、最も近いスコープはディレクティブで宣言されたスコープを上書きします。言い換えれば、関係なく、指令の適用範囲が何であるかの、

<div ng-controller='TransCtrl'>Inside Transclude Scope : {{name}}</div>

で{{name}}は常に$scope.nameがTransCtrlにあるものとなります。

Answer 2

問題は、コントローラがng-transcluded html内で定義されている方法と思われる。

私はbindToControllerが

が作動例えばthisフィドル参照指示レベルでコントローラを使用して

を構築

1. 使用して、それが明確になりました。

   controllerAs: "TransCtrl", 
   bindToController: true 
   

   「あなたのスコープにアクセスしようとしている親スコープ」というステートメントが正しくありません。私たちは親スコープのプロパティを使用しようとしています。つまり、子の内部からの名前（ng-transcluded content）です。これはプロトタイプの継承で可能ですが、それ以外の方法ではありません。