Angular 如何路由到子链接？

我的路由设置如下所示

app.routing.ts

app.component.html

home.component.html

我能找到去伦敦的路http://localhost:4200/home 和http://localhost:4200/login，但当我尝试导航到时失败http://localhost:4200/test1.

如何修复链接，以便在我转到http://localhost:4200/home/test1 它在contentarea中加载test1？

只需删除出口：。。。名称=

常量应用程序路径：路径=[ { 路径：登录， 组件：LoginComponent },{ 路径：家， 组件：HomeComponent， 儿童：[{ 路径：test1， 组件：Test1组件， },{ 路径：test2， 组件：Test2组件， }] }]; 家 进入测试1

---

始终必须有一个未命名的路由器出口。命名插座只能添加到未命名插座之外，并被命名为辅助路线或辅助路线。

哇，我花了18个小时试图解决这个问题，但不知道它有那么简单，多亏了许多人，一旦你知道了方法，大多数事情都很简单；-很高兴听到你能让它工作。总是有一个未命名的路由器插座。。。我原以为这是针对整个应用程序的，不，这是针对每个路由段的，但现在你提到了它，很明显这可能会被误解。我想这可以通过[routerLink]=['/home'，{outlet:{contentarea:'test1'}]实现@PankajParkar我确实试过了，它在某个点上起了作用，但却用圆括号创建了难看的URL，因为这就是路由器插座在我看来的工作方式。你不能像分段路由那样在路由中提到它们。。

import { Routes, RouterModule } from "@angular/router";
import { Test1Component } from "./pages/test1/test1.component";
import { Test2Component } from "./pages/test2/test2.component";
import { AuthService } from './shared/auth.service';
import { LoginComponent } from './login/login.component';
import { HomeComponent } from './home/home.component';

const APP_ROUTES: Routes = [
{
    path: "login",
    component: LoginComponent
},{
    path: "home",
    component: HomeComponent,
    children: [{
        path: "test1",
        component: Test1Component,
        outlet: "contentarea"
    },{
        path: "test2",
        component: Test2Component,
        outlet: "contentarea"
    }]
}];

export const routing = RouterModule.forRoot(APP_ROUTES);

<router-outlet></router-outlet>

<div class="row">
    <div class="col-xs-12">
        <h1>Home</h1>
        <a [routerLink]="['/home/test1']">Go to Test 1</a> <!-- Not working -->
        <router-outlet name="contentarea"></router-outlet>
    </div>
</div>