angular - Masalah Komponen di ionic 3


Saya telah membuat beberapa halaman di aplikasi Ionic, tetapi saat memanggil halaman tersebut, saya mendapatkan kesalahan berikut Uncaught (in promise): Error: No component factory found for BoxPage. Did you add it to @NgModule.entryComponents? Namun, saya telah menambahkan detail halaman ke app.component.ts sebagai import { BoxPage } from '../pages/box/box'; tetapi masalahnya tetap ada. Saya telah mengimplementasikan beberapa halaman seperti home, rincian produk, dan keranjang, dll., tetapi halaman baru yang dibuat menunjukkan kesalahan yang sama. Masalah serupa juga terjadi pada beberapa halaman baru lainnya.

Jawaban #1

Seperti yang dikatakan oleh kesalahan itu:

Kesalahan: Tidak ditemukan pabrik komponen untuk BoxPage. Apakah Anda menambahkannya ke @NgModule.entryComponents?

Anda perlu menambahkan halaman (komponen) itu ke @NgModule dari file app.module.ts Anda. Anda dapat menemukan lebih banyak informasi di dokumen Ionic:

Tidak ditemukan pabrik komponen untuk...

Kesalahan ini terjadi ketika Anda mencoba menggunakan komponen, penyedia, pipa, atau direktif yang belum diimpor dan ditambahkan ke ngModule Anda. Setiap kali Anda menambahkan komponen, penyedia, pipa, atau direktif baru ke aplikasi Anda, Anda harus menambahkannya ke ngModule di file src/app/app.module.ts agar Angular dapat menggunakannya. Untuk memperbaiki kesalahan ini, Anda dapat mengimpor komponen, penyedia, pipa, atau direktif yang bermasalah ke dalam file app.module dan kemudian jika itu adalah penyedia, tambahkan ke array providers dan untuk komponen, pipa, atau direktif tambahkan ke kedua array declarations dan entryComponents.

Jadi dalam kasus ini, Anda perlu menambahkannya ke keduanya, array entryComponents dan declarations:

import { BoxPage } from 'the/path/to/the/file';
// ...

@NgModule({
    declarations: [
        // ...
        BoxPage // <- Here!
    ],
    imports: [
        // ...
    ],
    bootstrap: [IonicApp],
    entryComponents: [
        // ...
        BoxPage // <- and also here!
    ],
    providers: [
        // ...
    ]
})
export class AppModule { }