แทนที่จะเป็นการฉีดElementRef
และใช้querySelector
หรือคล้ายกันจากที่นั่นสามารถใช้วิธีการประกาศแทนการเข้าถึงองค์ประกอบในมุมมองโดยตรง:
<input #myname>
@ViewChild('myname') input;
ธาตุ
ngAfterViewInit() {
console.log(this.input.nativeElement.value);
}
ตัวอย่าง StackBlitz
- @ViewChild ()รองรับคำสั่งหรือประเภทส่วนประกอบเป็นพารามิเตอร์หรือชื่อ (สตริง) ของตัวแปรแม่แบบ
- @ViewChildren ()ยังสนับสนุนรายชื่อเป็นรายการที่คั่นด้วยเครื่องหมายจุลภาค (ปัจจุบันไม่อนุญาตให้เว้นวรรค
@ViewChildren('var1,var2,var3')
)
- @ContentChild ()และ@ContentChildren ()ทำเช่นเดียวกัน แต่ใน DOM แสง (
<ng-content>
องค์ประกอบที่คาดการณ์)
ลูกหลาน
@ContentChildren()
เป็นคนเดียวที่อนุญาตให้สอบถามด้วยเพื่อสืบทอด
@ContentChildren(SomeTypeOrVarName, {descendants: true}) someField;
{descendants: true}
ควรเป็นค่าเริ่มต้น แต่ไม่ได้อยู่ใน 2.0.0 สุดท้ายและถือเป็นข้อผิดพลาด
นี่คือการแก้ไขใน 2.0.1
อ่าน
หากมีส่วนประกอบและคำสั่งread
พารามิเตอร์อนุญาตให้ระบุอินสแตนซ์ที่ควรส่งคืน
ตัวอย่างเช่นViewContainerRef
จำเป็นโดยคอมโพเนนต์ที่สร้างขึ้นแบบไดนามิกแทนค่าเริ่มต้นElementRef
@ViewChild('myname', { read: ViewContainerRef }) target;
สมัครรับการเปลี่ยนแปลง
แม้ว่า view children จะถูกตั้งค่าเมื่อngAfterViewInit()
มีการเรียกเท่านั้นและ content children จะถูกตั้งค่าเมื่อngAfterContentInit()
มีการเรียกเท่านั้นหากคุณต้องการสมัครรับข้อมูลการเปลี่ยนแปลงผลการสืบค้นควรทำในngOnInit()
https://github.com/angular/angular/issues/9689#issuecomment-229247134
@ViewChildren(SomeType) viewChildren;
@ContentChildren(SomeType) contentChildren;
ngOnInit() {
this.viewChildren.changes.subscribe(changes => console.log(changes));
this.contentChildren.changes.subscribe(changes => console.log(changes));
}
การเข้าถึง DOM โดยตรง
สามารถสืบค้นองค์ประกอบ DOM เท่านั้น แต่ไม่สามารถใช้องค์ประกอบหรืออินสแตนซ์คำสั่ง:
export class MyComponent {
constructor(private elRef:ElementRef) {}
ngAfterViewInit() {
var div = this.elRef.nativeElement.querySelector('div');
console.log(div);
}
// for transcluded content
ngAfterContentInit() {
var div = this.elRef.nativeElement.querySelector('div');
console.log(div);
}
}
รับเนื้อหาที่ฉายตามอำเภอใจ
ดูที่การเข้าถึงเนื้อหาที่รวมอยู่