尝试在构造函数或ngOnInit中获取组件的@Input值。但它一直是“未定义”。
我用console.log更新了英雄plunker来显示问题(beta角)。
http://plnkr.co/edit/dseNM7OTFi1VNG2Z4Oj5?p=preview
export class HeroDetailComponent implements OnInit {
constructor(){
console.log('hero',this.hero)
}
public hero: Hero;
ngOnInit() {
console.log('hero',this.hero)
}
}
我在这里做错了什么?
您在ngOnInit中未定义的原因是因为在初始化组件的时候,您并没有真正传入一个Hero对象
<my-hero-detail [hero]="selectedHero"></my-hero-detail>
此时,selectedHero在您的AppComponent中没有任何值,直到列表上的click事件调用onSelect方法
编辑:抱歉意识到我没有提供修复。如果你添加一个ngIf到我的英雄细节
<my-hero-detail *ngIf="selectedHero" [hero]="selectedHero"></my-hero-detail>
你应该会延迟my-hero-detail组件的初始化,你应该看到控制台的输出。当选择的英雄变化时,不会再输出。