Dalam kebanyakan kasus, Anda ingin menggunakannya {static: false}
. Menyetelnya seperti ini akan memastikan kecocokan permintaan yang bergantung pada resolusi yang mengikat (seperti arahan struktural *ngIf, etc...
) akan ditemukan.
Contoh kapan harus menggunakan static: false
:
@Component({
template: `
<div *ngIf="showMe" #viewMe>Am I here?</div>
<button (click)="showMe = !showMe"></button>
`
})
export class ExampleComponent {
@ViewChild('viewMe', { static: false })
viewMe?: ElementRef<HTMLElement>;
showMe = false;
}
Ini static: false
akan menjadi perilaku fallback default di Angular 9. Baca lebih lanjut di sini dan di sini
The { static: true }
pilihan diperkenalkan untuk mendukung menciptakan tertanam pandangan dengan cepat. Ketika Anda membuat tampilan secara dinamis dan ingin mengaksesnya TemplateRef
, Anda tidak akan dapat melakukannya ngAfterViewInit
karena akan menyebabkan ExpressionHasChangedAfterChecked
kesalahan. Mengatur flag statis menjadi true akan membuat tampilan Anda di ngOnInit.
Namun:
Dalam kebanyakan kasus lain, praktik terbaik adalah menggunakan {static: false}
.
Perlu diketahui juga bahwa { static: false }
opsi akan dibuat default di Angular 9. Yang berarti bahwa pengaturan flag statis tidak lagi diperlukan, kecuali jika Anda ingin menggunakan static: true
opsi.
Anda dapat menggunakan ng update
perintah clari sudut untuk secara otomatis meningkatkan basis kode Anda saat ini.
Untuk panduan migrasi dan informasi lebih lanjut tentang ini, Anda dapat memeriksa di sini dan di sini
Apa perbedaan antara permintaan statis dan dinamis?
Opsi statis untuk kueri @ViewChild () dan @ContentChild () menentukan kapan hasil kueri tersedia.
Dengan kueri statis (statis: benar), kueri diselesaikan setelah tampilan dibuat, tetapi sebelum deteksi perubahan berjalan. Hasilnya, bagaimanapun, tidak akan pernah diperbarui untuk mencerminkan perubahan pada pandangan Anda, seperti perubahan ke ngIf dan ngFor blok.
Dengan kueri dinamis (statis: salah), kueri diselesaikan setelah ngAfterViewInit () atau ngAfterContentInit () untuk masing-masing @ViewChild () dan @ContentChild (). Hasilnya akan diperbarui untuk perubahan pada tampilan Anda, seperti perubahan ke ngIf dan ngFor blok.
{ static: true }
, tetapi jika tidak ada kebutuhan langsung untuk memiliki akses ke ViewChild di dalamngOnInit
, Anda harus menggunakan{ static: false }
.Jadi sebagai aturan praktis Anda dapat mengikuti yang berikut:
{ static: true }
kebutuhan untuk menjadi set ketika Anda ingin mengaksesViewChild
dingOnInit
.{ static: false }
hanya dapat diakses dingAfterViewInit
. Ini juga yang Anda inginkan ketika Anda memiliki arahan struktural (yaitu*ngIf
) pada elemen Anda di template Anda.sumber
Dari dokumen sudut
Mungkin ide yang lebih baik untuk digunakan
static:true
jika anak tidak tergantung pada kondisi apa pun. Jika visibilitas elemen berubah, makastatic:false
dapat memberikan hasil yang lebih baik.PS: Karena ini fitur baru, kami mungkin perlu menjalankan benchmark untuk kinerja.
Edit
Seperti yang disebutkan oleh @Massimiliano Sartoretto, github commit dapat memberi Anda lebih banyak wawasan.
sumber
Datang ke sini karena ViewChild adalah null di ngOnInit setelah memutakhirkan ke Angular 8.
Kueri statis diisi sebelum ngOnInit, sementara kueri dinamis (statis: salah) diisi sesudahnya. Dengan kata lain, jika viewchild sekarang null di ngOnInit setelah Anda menetapkan static: false, Anda harus mempertimbangkan untuk mengubah ke static: true atau pindahkan kode ke ngAfterViewInit.
Lihat https://github.com/angular/angular/blob/master/packages/core/src/view/view.ts#L332-L336
Jawaban lain benar dan menjelaskan mengapa hal ini terjadi: Permintaan bergantung pada arahan struktural, misalnya referensi ViewChild di dalam ngIf, harus dijalankan setelah persyaratan arahan ini telah diselesaikan, yaitu setelah deteksi perubahan. Namun, orang dapat dengan aman menggunakan statis: true dan dengan demikian menyelesaikan pertanyaan sebelum ngOnInit untuk referensi yang tidak diuji. Seandainya kasus khusus ini disebut sebagai pengecualian nol mungkin bisa menjadi cara pertama Anda akan menemui kekhususan ini, seperti bagi saya.
sumber
lihat child @angular 5+ token dua argumen ('nama referensi lokal', statis: false | true)
untuk mengetahui perbedaan antara benar dan salah periksa ini
sumber
Dalam ng8, Anda dapat secara manual mengatur kapan untuk mengakses komponen anak di komponen induk. Ketika Anda mengatur statis ke true, itu berarti komponen induk hanya mendapatkan definisi komponen di
onInit
hook: Misalnya:Jika statis salah, maka Anda hanya mendapatkan definisi di ngAfterViewInit (), di ngOnInit (), Anda tidak akan terdefinisi.
sumber