Typescript ANGLE找不到辅助‘路由出口’的路由路径

为了更好地理解这个概念，我正在试验Angular 布线.当我单击About链接时，我收到异常NG04002: Cannot match any routes. URL Segment: 'about'，该链接正在路由到名为outlet1的辅助router-outlet.路由到主router-outlet工作良好.我不明白为什么它不想转到辅助队router-outlet？ *这是我的app.Component.html

<div style="text-align:center">
  <h1>
    Welcome to {{title}}!!
  </h1>
  <nav>
    <div class="container">
      <div class="row">
        <div class="col-2">
          <a routerLink="home" routerLinkActive="active"><button type="button" class="btn btn-primary">
              Home</button></a>
        </div>
        <div class="col-2">
          <a routerLink="about"><button type="button" class="btn btn-primary">
              About</button></a>
        </div>

        <div class="col-1">
          <a routerLink="dashboard"><button type="button" class="btn btn-primary">
              Dashboard</button></a>
        </div>
      </div>
    </div>
</nav>
  <router-outlet></router-outlet>
  <div >
    <button type="button" class="btn btn-primary">Primary</button>
    <button type="button" class="btn btn-secondary">Secondary</button>
    <button type="button" class="btn btn-success">Success</button>
    <button type="button" class="btn btn-danger">Danger</button>
    <button type="button" class="btn btn-warning">Warning</button>
    <button type="button" class="btn btn-info">Info</button>
    <button type="button" class="btn btn-light">Light</button>
    <button type="button" class="btn btn-dark">Dark</button>

    <button type="button" class="btn btn-link">Link</button>
  </div>
</div>
<router-outlet name="outlet1"></router-outlet>

这是我的应用程序-routing.mode.ts

import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { HomeComponent } from './components/home/home.component';
import { AboutComponent } from './components/about/about.component';
import { DashboardComponent } from './components/dashboard/dashboard.component';
import { AuthGuard } from './auth.gard';

const routes: Routes = [
  { path: 'home',
    component: HomeComponent
  },
  {
    path: 'about', canActivate: [AuthGuard],
    component: AboutComponent, outlet:"outlet1",
  },
  { path: 'dashboard',
    component: DashboardComponent
  }];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { }