Question

假设我有以下形式的数据对象列表：

my_list = [
    {name:Alice, age:23},
    {name:Bill, age:33},
    {name:Clara, age:43}
];

我使用ngFor根据数组创建一组自定义组件：

<person-widget *ngFor="#item of my_list"></person-widget>

我想通过将PersonWidget param作为item的一部分传递给实例，让每个创建的ngFor实例访问生成它的列表项的属性。或以某种方式让实例访问原始数据。

基本上，在每个PersonWidget课程中，我希望能够使用my_data_object.name并获得Alice或Bob或Clara的值。

有关如何做到这一点的建议，或者是否有更好的，更多的＆＃34; Angular2＆＃34;这样做的方式？

全部谢谢：）

Answer 1

您可以使用person-widget组件的参数：

<person-widget *ngFor="#item of my_list" [item]="item"></person-widget>

person-widget组件必须已定义此参数，如下所述：

@Component({
  selector: 'person-widget',
  template: `
    <div>{{item.name}}</div>
  `
})
export class PersonWidgetComponent {
  @Input()
  item: any;

  ngOnInit() {
    console.log(this.item.name);
  }
}

Angular2 - 获取ngFor将#item传递给构造实例

1 个答案: