私は<strong>新しい$スコープ</strong>を作成する別のコンポーネント

Question

私はd3jsいくつか.floating-nodeをして、それぞれのために作成してい角度1.5.5

でcomponent based appプロジェクトを構築していて、新しいスコープを取得し、の内側に追加コンパイルされたコンポーネント。

nodeEnter.each(() => { 
     let childScope = this.$scope.$new(); 
     childScope.test = "test"; 
     let compiled = this.$compile('<mycomponent></mycomponent>')(childScope); 
     (this.mainContainer).append(compiled); 
    }); 

完全にコードの仕事のこの部分：

このコードの一部は次のようになり。

そして、これがmycomponent

export default class Mycomponent { 
    constructor($scope) { 
     console.log($scope.test);   // undefined 
     console.log($scope.$parent.test); // test 
    } 
} 
Mycomponent.$inject = ["$scope"]; 

あるしかし、私は私のmycomponentコンポーネントで取得するとき。私は権利を得ることができません$scope。

私は$idをチェックしchildScope.$idがMycomponent$scope.$id += 1

に私は$scope.$parentを介して取得することができます知っているが、私は望ましくない$scopeを作成し、それが本当にループに感謝いないことを理解しています。

どのように私は同じを得ることができます$scope？

Answer 1

$compileはすでにスコープの新しいインスタンスを作成しているため、$scope.$new()を使用する必要はありません。

あなたの問題を解決する簡単な方法は、querySelectorを使用することです、私は次のコードのようなものをやってするお手伝いをする必要がありますね：

newScope = angular.element(document.querySelector("#myId")).isolateScope();

あなたが今newScopeを介してデータを渡すことができるはずです。この方法。

Answer 2

誤解があるようです。 .componentは常に独自の独立したスコープを作成し、コンポーネントでは$scopeを使用しないでください。あなたのケースで絶対に必要と思われる場合は、.directiveを使用してください。私はあなたのコンポーネントを適切に再設計することをお勧めします。