Pass object to component
<p>I have created a component that needs to have a reference to the object for which the component was created. I didn't make to work and all my trials have failed. Below, I try to describe the intention.</p>

<p>The component definition would maybe look like this:</p>

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

function MyController(myObject) {
    var vm = this;

    vm.myObject = myObject;
}
</code></pre>

<p>In a service I would like to create my object like this:</p>

<pre><code>function createMyObject(args) {
        var myObject = {some: data};

        myObject.ref = "&lt;my-component myObject='{{myObject}}'&gt;&lt;/my-component&gt;";
        return myObject;
    }
</code></pre>

<p><strong>Question</strong></p>

<p>How can I pass data to angular component tag? Do I have to switch back to a component directive to make it work? </p>

<p>Any ideas are greatly appreciated. Thank you.</p>