@Input属性在角度2中未定义onInit

尝试在构造函数或ngOnInit中获取组件的@Input值。但它始终是“未定义的”。@Input属性在角度2中未定义onInit

我用console.log更新了英雄plunker以显示问题（测试版角度）。 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) 
    } 
}

我在做什么错在这里？

来源

2015-12-21 eesdil

嗯，我并没有意识到，在这个例子中，我们没有选择immidatelly英雄......我很高兴，它不是在蹲在任何工作:)我检查它在掠夺者，它工作正常。但是，在我的代码中，它不能正常工作，但它已初始化......对于错误的重击程序感到抱歉。我会接受答案，但它不能解决我的问题。 – eesdil

所以问题是，我已经把@Input ...中的camelCase属性“inputProperty”，而不是“输入属性”...奇怪没有意识到..但在API文档中是这样写的。 – eesdil

你在ngOnInit得到未定义的原因是因为在那里部件被初始化，你还没有真正在Hero对象

<my-hero-detail [hero]="selectedHero"></my-hero-detail>

通过此时selectedHero点在你的AppComponent没有价值直到列表上的点击事件调用onSelect方法

编辑：对不起，我没有真正提供修复。如果添加ngIf到my-hero-detail

<my-hero-detail *ngIf="selectedHero" [hero]="selectedHero"></my-hero-detail>

你应该这样会耽误my-hero-detail组件的初始化，你应该看到控制台输出。然而这不会当所选英雄改变时再次输出。

来源

2015-12-21 13:35:25 Zyzle

解决我的问题，所以thx。想想就行了，你可能会发现一些新的东西 – materliu

谢谢你。 – user2180794

这是因为英雄是异步加载的，所以当视图初始渲染时，选定的英雄是不确定的。但是在选择后，英雄会被传递到具有定义值的细节视图中。

您基本上只是看到基于原始值（未定义）的onInit调用。

如果你想类似的每次选择后执行的东西，你可以修改它是这样的：

export class HeroDetailComponent implements AfterViewChecked { 
    constructor(){ 
    console.log('hero', this.hero) 
    } 
    public hero: Hero; 

    ngAfterViewChecked() { 
    console.log('hero', this.hero) 
    } 
}

来源

2015-12-21 13:35:39 TGH

这应该是在顶部。谢谢！！！ – IvRRimUm

是的，它应该。 –

使用angular5。错误：ExpressionChangedAfterItHasBeenCheckedError：检查后表达式已更改。先前的值：'未定义'。当前值：'[对象对象]'。 –

@Input属性在角度2中未定义onInit

回答

相关问题