ng Test ‚<component> ist kein bekanntes Element‘

Question

ich mit Winkel 2 arbeite und Ich erhalte diese Meldung, wenn ich einen Test mit ng test --build=false --watch=false laufen:

'app-feed' is not a known element: 
1. If 'app-feed' is an Angular component, then verify that it is part of this mod 
2. If 'app-feed' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@Ng 
[ERROR ->]<app-feed></app-feed>** 

app.component.html Dateiinhalt:

<app-menu></app-menu> 
<app-feed></app-feed> 

app.component.ts Dateiinhalt:

import { Component } from '@angular/core'; 

@Component({ 
    selector: 'app-root', 
    templateUrl: './app.component.html', 
    styleUrls: ['./app.component.css'] 
}) 
export class AppComponent { 
    title = 'app works!'; 
    wonderfulProperty = 'Hola'; 
} 

app.module.ts fil e Inhalt:

import { BrowserModule } from '@angular/platform-browser'; 
import { NgModule } from '@angular/core'; 
import { FormsModule } from '@angular/forms'; 
import { HttpModule } from '@angular/http'; 

import { AppComponent } from './app.component'; 
import { MenuComponent } from './menu/menu.component'; 
import { FeedComponent } from './feed/feed.component'; 

@NgModule({ 
    declarations: [AppComponent,MenuComponent,FeedComponent], 
    imports: [BrowserModule, FormsModule,HttpModule], 
    providers: [], 
    bootstrap: [AppComponent] 
}) 
export class AppModule { } 

feed.component.ts Dateiinhalt:

import { Component, OnInit } from '@angular/core'; 

@Component({ 
    selector: 'app-feed', 
    templateUrl: './feed.component.html', 
    styleUrls: ['./feed.component.css'] 
}) 
export class FeedComponent implements OnInit { 

    constructor() { } 

    ngOnInit() {} 

} 

Kann mir jemand helfen, herauszufinden, wie dieses Problem beheben?

Answer 1

Wie an anderer Stelle erwähnt, sollten Sie Ihre Spezifikationsdatei posten.

Ich habe einen Weg gefunden, ein Problem sehr ähnlich zu behandeln, indem ich Module benutze. Erstellen Sie ein neues Modul an feed/feed.module.ts und importieren Sie Ihre FeedComponent innerhalb davon:

import {NgModule} from '@angular/core'; 
import {CommonModule} from '@angular/common'; 
import {FeedComponent} from './feed.component'; 

@ngModule({ 
    imports: [CommonModule], 
    declarations: [FeedComponent], 
    exports: [FeedComponent] 
}) 
export class FeedModule {} 

ändern app.module.ts dazu:

import { BrowserModule } from '@angular/platform-browser'; 
import { NgModule } from '@angular/core'; 
import { FormsModule } from '@angular/forms'; 
import { HttpModule } from '@angular/http'; 
import { FeedModule } from './feed/feed.module'; 

import { AppComponent } from './app.component'; 
import { MenuComponent } from './menu/menu.component'; 

@NgModule({ 
    declarations: [AppComponent,MenuComponent], 
    imports: [BrowserModule, FormsModule, HttpModule, FeedModule], 
    providers: [], 
    bootstrap: [AppComponent] 
}) 
export class AppModule { } 

Dann schließen Sie das Einzugsmodul in der Spec-Datei:

import {FeedModule} from 'path/to/feed.module'; 
... 
TestBed.configureTestingModule({ 
    ... 
    imports: [FeedModule, ...] 
    ... 
})