我是 Angular4 的新手。
当我尝试探索 Angular4 中的路由时，我收到以下错误
EXCEPTION: Uncaught (in promise): Error: Cannot find primary outlet to load 'AppComponent'
我检查了要修复的链接数量，但还没有有用的。
这就是应用程序的样子。
index.html
<body>
<app-root>Loading...</app-root>
<router-outlet> </router-outlet>
</body>
app.module.ts
import { BrowserModule } from '@angular/platform-browser';
import { NgModule, } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import {RouterModule, Routes } from '@angular/router';
import { AppComponent } from './app.component';
import { CustomerComponent } from './component/customer/customer.component';
import {appRoutes} from './app.routes';
@NgModule({
declarations: [
AppComponent,
CustomerComponent
],
imports: [
BrowserModule,
FormsModule,
HttpModule,
RouterModule.forRoot(appRoutes,{useHash:true})
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
app.routes.ts
import {RouterModule, Routes } from '@angular/router';
import {AppComponent} from './app.component';
import {CustomerComponent} from './component/customer/customer.component';
export const appRoutes: Routes = [
{ path: '', component: AppComponent },
{ path: 'customer', component: CustomerComponent },
{
path: 'heroes',
component: AppComponent,
data: { title: 'Heroes List' }
},
{ path: '',
redirectTo: '/heroes',
pathMatch: 'full'
},
{ path: '**', component: AppComponent }];
app.component.html
<h1> {{title}} </h1>
<a router-link="">Home</a>
<a router-link="customer">customer </a>
app.component.ts
import { Component } from '@angular/core';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
title = 'app works!';
}
这里缺少什么配置来使路由生效？
最佳答案
请正确使用 routerlink 配置，如下所示。 <a [routerLink]="['/customer']">customer</a>将生成链接/customer/
关于javascript - Angular 4 路由 - 异常 : Uncaught (in promise): Error: Cannot find primary outlet to load 'AppComponent' ，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/47571047/