Angular7 routing error: Cannot match any routes - Codes Helper

paste the code first

appModule.ts:

import { BrowserModule } from "@angular/platform-browser";
import { NgModule } from "@angular/core";

import { AppComponent } from "./app.component";
import { LoginComponent } from "./login/login.component";
import { Routes, RouterModule } from "@angular/router";
import { ProfileComponent } from "./profile/profile.component";
import { PasswordsettingsComponent } from "./passwordsettings/passwordsettings.component";
import { LifeIsStrangeComponent } from "./life-is-strange/life-is-strange.component";

export const ROUTES: Routes = [
  { path: "profile/:username", component: ProfileComponent,outlet:"pView" }
  
];
@NgModule({
  declarations: [
    AppComponent,
    LoginComponent,
    ProfileComponent,
    PasswordsettingsComponent,
    LifeIsStrangeComponent
  ],
  imports: [
    BrowserModule,
    RouterModule.forRoot(ROUTES)
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

app.component.ts:

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

@Component({
  selector: "app-root",
  templateUrl: "./app.component.html",
  styleUrls: ["./app.component.css"]
})
export class AppComponent {
  title = "angular-route";
}

Page app.component.html:

<a routerLink="/profile/zhz">page1</a><br>
<router-outlet name="pView"></router-outlet>

the following error occurs after clicking the link:
ERROR Error: Uncaught (in promise): Error: Cannot match any routes. URL Segment: "profile/zhz"
Error: Cannot match any routes. URL Segment: "profile/zhz"

there is a problem here, as long as I do not specify the outlet of the route output in the route configuration, and a < route-outlet > < / route-outlet > without the name attribute on the page can find and output the route content normally. I want to know what went wrong?