Artikel ini akan membawa anda melalui @ViewChild dalam Angular dan memperkenalkan cara menggunakan @ViewChild.
Ringkasnya
Pemahaman peribadi saya tentang @ViewChild ialah: ia adalah rujukan, yang melaluinya komponen atau elemen boleh diperolehi. Dan kita boleh menggunakan nilai dan kaedah yang diperolehi dari komponen ini. [Cadangan tutorial berkaitan: "tutorial sudut"]
Untuk mengetahui dengan lebih intuitif perkara yang dilakukannya, pergi terus ke kod
anak komponen anak
content:'Zita'; changeChildCon() { this.content = 'Zita1111' }
induk komponen induk
html <app-child></app-child> ts import { ViewChild } from '@angular/core'; @ViewChild('ChildrenView', { static: true }) childrenView: any; //ChildrenView为子组件中的#后边的值,childrenView是个名称用来指代子组件 this.childrenView.content // Zita 获取子组件中的值 this.childrenView.changeChildCon() // 执行子组件中的方法 this.childrenView.content // Zita1111
html
<figure> 我是父元素中的一个标签figure,我可以通过viewchild来获取,并且获取到我之后可以改变我的样式 </figure>
ts
import { ViewChild, ElementRef } from '@angular/core'; @ViewChild('parBele', { static: true }) eleRef: ElementRef; this.eleRef.nativeElement.style.color = 'red'; // 更改获取的dom元素的样式
Kemudian, melalui kod ini, anda akan melihat pada halaman, Warna fon dalam teg rajah bertukar kepada merah
Selepas angular8.0Pastikan anda menambah { statik: benar } Atribut ini, sebagai tambahan, penjelasan rasmi untuk atribut ini ialah:
Atribut metadata:
pemilih - jenis arahan atau nama yang digunakan untuk pertanyaan.
baca - Baca token lain daripada elemen yang ditanya.
statik - Benar untuk menyelesaikan hasil pertanyaan sebelum pengesanan perubahan dijalankan, salah untuk menyelesaikan selepas pengesanan perubahan Lalai kepada palsu.
Untuk statik, ini bermakna: jika benar, pengesanan perubahan sedang menjalankan hasil pertanyaan. dihuraikan sebelum, atau selepas pengesanan perubahan jika palsu. Lalai adalah palsu.
Bagaimana anda memahaminya?
Terutamanya terletak pada nod di mana tindakan "pengesanan perubahan" berlaku.
Sebagai contoh, kita sering menggunakan arahan ngIf dan ngShow Jika arahan ini ditambahkan pada subkomponen, dan statik adalah benar pada masa yang sama. Kemudian, apabila kita menangkap sasaran rujukan, nilai yang diperolehi akan menjadi tidak ditentukan
Pada ketika ini, pemahaman saya tentang @ViewChild, yang sering digunakan dalam projek sebenar, telah berakhir... Izinkan saya berkongsi galakan saya dengan anda
Untuk lebih banyak pengetahuan berkaitan pengaturcaraan, sila lawati: Pengajaran Pengaturcaraan! !
Atas ialah kandungan terperinci Perbincangan ringkas tentang penggunaan @ViewChild dalam Angular. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!