angular6 - Angular-6 路由器出口不是已知元素,模板解析错误
问题描述
应用程序路由.module.ts
import {NgModule} from '@angular/core';
import {RouterModule, Routes} from '@angular/router';
import {PostListComponent} from './post/post-list.component';
const routes: Routes = [
{ path: '', redirectTo: '/home', pathMatch: 'full' },
{ path: 'posts', component: PostListComponent},
]
@NgModule({
imports: [ RouterModule.forRoot(routes)],
exports: [ RouterModule ]
})
export class AppRoutingModule{
}
**app.component.html**
<a routerLink='/posts'>View Posts</a>
<div style="text-align:center">
<h1>
Welcome to {{ title }}!
</h1>
</div>
<router-outlet></router-outlet>
解决方案
我知道我没有在我的App.module.ts中导入我的App-routing.module
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppRoutingModule } from './app-routing.module';
import { HttpClientModule } from '@angular/common/http';
import { AppComponent } from './app.component';
import { PostListComponent } from './post/post-list.component';
import { PostService} from './post/post.service';
import { HomepageComponent } from './homepage/homepage.component';
@NgModule({
declarations: [
AppComponent,
PostListComponent,
HomepageComponent
],
imports:[
BrowserModule,
HttpClientModule,
**AppRoutingModule**
],
providers: [
PostService
],
bootstrap: [AppComponent]
})
export class AppModule { }