angular - 如何导航到父路由(或清除路由器导出)？ Angular 5

Question

假设我的观点是这样的:

本地主机/main

  <h1>Angular Router</h1>
  <nav>
    <a routerLink="/crisis-center" routerLinkActive="active">Crisis Center</a>
    <a routerLink="/heroes" routerLinkActive="active">Heroes</a>
  </nav>
  <router-outlet></router-outlet>

如果我点击英雄，那么 URI 将是例如。 localhost/main/heroes

我想在 typescript 中添加功能以导航回localhost/main。

但是我不想使用这样的功能

private navigateToDefaultView() {
    this.router.navigate(["/main"]);
}

因为/main部分可能会改变。我更喜欢这样的东西

private navigateToDefaultView() {
    this.router.navigate(ToParentRoute);
// or
    clearRouterOutletSomeHow
}

这可能吗？或者我被迫以字符串形式提供 URI。

---

编辑: 我想出了类似的东西:

ngOnInit() {
        this.isMainActivated= this.router.url.indexOf("/main") > -1;
        this.isHomeActivated= this.router.url.indexOf("/home") > -1;
}

private navigateToDefaultView() {
        let url;
        if (this.isMainActivated) {
            url = this.router.url.substring(0, this.router.url.indexOf("main") + "main".length);
        } else if (this.isHomeActivated) {
            url = this.router.url.substring(0, this.router.url.indexOf("home") + "home".length);
        }

        this.router.navigate([url]);
    }

但我更喜欢更优雅的解决方案。

Answer 1

解决方案比我想象的要容易。

<button [routerLink]="['../']">
   Back
</button>

并且它返回到父网址。