如何在Angular2中使用@ViewChildren?
问题描述:
在我的Home.html:如何在Angular2中使用@ViewChildren?
<p #pmessage>msg 1</p>
<p #pmessage>msg 2</p>
<p #pmessage>msg 3</p>
<p #pmessage>msg 4</p>
在我home.ts:
export class HomePage {
@ViewChildren('pmessage') pMessages;
constructor() {
//using first works, result <p>msg 1</p>
console.log(this.pMessages.first.nativeElement);
//using last also works, result <p>msg 4</p>
console.log(this.pMessages.last.nativeElement);
//How can I get the two in the middle? i.e <p>msg 2</p> and <p>msg 3</p>
//this isn't working
console.log(this.pMessage[1].nativeElement);
//this either isn't working
console.log(this.pMessage.1.nativeElement);
}
}
请帮助。谢谢。
答
访问pMessages
时有错字。 's'丢失。你
`console.log(this.pMessages[1].nativeElement);`
同时也应该访问ngAfterViewInit
或更高版本viewChildren。在此之前,变量可能为undefined
+0
您的解决方案无法正常工作。请参阅我的plunkr:http://plnkr.co/edit/yuYQz7Mt1KGfzpWV0GrK?p=preview – Vicheanak
您无法在构造函数中访问'this.pMessages'。它只在调用'ngAfterViewInit()'时设置。 –
试试这个: console.log(this.pMessage.toArray()[1] .nativeElement); –