如何在AngularJS中将数据从父级发送到子级

Question

How can I send the data from the Parent Controller (index) to the Child Controller (Component). Please see the example, instead of the hardcoding the url I want to send the parameters for the Title and the URL from the page controller to the component. I'm stuck to send it and I don't know where is the problem.

index.html

<div>
  <my-list obj="vm.obj"></my-list>
</div>

index.controller.js

this.obj = {
    testURL: "AngularJS",
    testName: "Testing Environment
}

mylistComponent.html

<span>{{vm.myTestName}}</span>
<a href="https://en.wikipedia.org/wiki/{{vm.myTestURL}}">AngularJS Wikipedia</a>

mylist.Component.js

binding: {
    obj: "="
}

this.goToPage = function() {
    this.myTestName = this.obj.testName;
    this.myTestURL = this.obj.testURL;
}

PLUNKER

Answer 1

In your plunker, by doing this :

<test-component value="vm.obj"> </test-component>

You put the value of obj in the var value . So in the child scope you can access to this value with the var value not anymore with obj .

Here is your plunker updated.