オブジェクトをコンポーネントに渡す

Question

コンポーネントが作成されたオブジェクトへの参照を必要とするコンポーネントを作成しました。私は仕事をしなかったし、すべての試練は失敗した。以下、私はその意図を説明しようとします。

コンポーネント定義は、多分次のようになります。私はこのように私のオブジェクトを作成したいサービスで

angular 
    .module('myModule') 
    .component('myComponent', { 
     templateUrl: "template.html", 
     controller: [ 
      MyController 
     ], 
     bindings: { 
      myObject: '=' 
     } 
    }); 

function MyController(myObject) { 
    var vm = this; 

    vm.myObject = myObject; 
} 

：

function createMyObject(args) { 
     var myObject = {some: data}; 

     myObject.ref = "<my-component myObject='{{myObject}}'></my-component>"; 
     return myObject; 
    } 

質問

どのようにすることができますデータを角度成分タグに渡しますか？コンポーネントディレクティブに戻って動作させる必要がありますか？

アイデアをいただければ幸いです。ありがとうございました。

Answer 1

ソリューションテンプレートで1

：コードで

<my-component key='$ctrl.myObject'></my-component> 

：

angular 
    .module('myModule') 
    .component('myComponent', { 
     templateUrl: "template.html", 
     controller: [ 
      'objectService' 
      MyController 
     ], 
     bindings: { 
      key: '=' // or key: '<' it depends on what binding you need 
     } 
    }); 

function MyController(myObject, objectService) { 
    var vm = this; 

    vm.myObject.whatever(); // myObject is assigned to 'this' automatically 
} 

ソリューション2 - コンポーネントバインディングを介した

コンポーネント：

angular 
.module('myModule') 
.component('myComponent', { 
    templateUrl: "template.html", 
    controller: [ 
     'objectService' 
     MyController 
    ], 
    bindings: { 
     key: '@' 
    } 
}); 
function MyController(myObject, objectService) { 
    var vm = this; 

    vm.myObject = objectService.find(vm.key); 
} 

使用法：

function createMyObject(args) { 
    var myObject = {key: ..., some: data}; 

    myObject.ref = "<my-component key='" + myObject.key + "'></my-component>"; 
    return myObject; 
}