Di AppComponent, saya menggunakan komponen nav di kode HTML. UI terlihat bagus. Tidak ada kesalahan saat melakukan servis. dan tidak ada kesalahan di konsol saat saya melihat aplikasi.
Tetapi ketika saya menjalankan Karma untuk proyek saya, ada kesalahan:
Failed: Template parse errors:
'app-nav' is not a known element:
1. If 'app-nav' is an Angular component, then verify that it is part of this module.
2. If 'app-nav' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.
Di app.module.ts saya :
ada:
import { NavComponent } from './nav/nav.component';
Itu juga ada di bagian deklarasi NgModule
@NgModule({
declarations: [
AppComponent,
CafeComponent,
ModalComponent,
NavComponent,
NewsFeedComponent
],
imports: [
BrowserModule,
FormsModule,
HttpModule,
JsonpModule,
ModalModule.forRoot(),
ModalModule,
NgbModule.forRoot(),
BootstrapModalModule,
AppRoutingModule
],
providers: [],
bootstrap: [AppComponent]
})
Saya menggunakan NavComponent
di sayaAppComponent
app.component.ts
import { Component, ViewContainerRef } from '@angular/core';
import { Overlay } from 'angular2-modal';
import { Modal } from 'angular2-modal/plugins/bootstrap';
import { NavComponent } from './nav/nav.component';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
title = 'Angela';
}
app.component.html
<app-nav></app-nav>
<div class="container-fluid">
</div>
Saya telah melihat pertanyaan serupa, tetapi jawaban dalam pertanyaan itu mengatakan kita harus menambahkan NgModule di komponen nav yang memiliki ekspor di dalamnya, tetapi saya mendapatkan kesalahan kompilasi ketika saya melakukan itu.
Ada juga: app.component.spec.ts
import {NavComponent} from './nav/nav.component';
import { TestBed, async } from '@angular/core/testing';
import { AppComponent } from './app.component';
javascript
node.js
angular
typescript
karma-jasmine
Angela P.
sumber
sumber
import { NavComponent }
di spec.ts AndaJawaban:
Karena dalam pengujian unit Anda ingin menguji komponen yang sebagian besar diisolasi dari bagian lain aplikasi Anda, Angular tidak akan menambahkan dependensi modul Anda seperti komponen, layanan, dll secara default. Jadi, Anda perlu melakukannya secara manual dalam pengujian Anda. Pada dasarnya, Anda memiliki dua opsi di sini:
A) Nyatakan NavComponent asli dalam pengujian
B) Mock the NavComponent
Anda akan menemukan informasi lebih lanjut di dokumentasi resmi .
sumber
AppModule
dalam konfigurasi TestBed. Apakah Anda akan merekomendasikan hal ini?Anda juga bisa menggunakan
NO_ERRORS_SCHEMA
https://2018.ng-conf.org/mocking-dependencies-angular/
sumber
Bagi saya mengimpor komponen di induk menyelesaikan masalah.
Tambahkan ini di
spec of the parent
tempat komponen ini digunakan.sumber
Satu alasan lagi adalah mungkin ada beberapa
.compileComponents()
untukbeforeEach()
dalam kasus uji Andauntuk mis
sumber
Langkah 1: Buat stub di awal file spesifikasi.
Langkah 2: Tambahkan stub di deklarasi komponen.
sumber