如何導航到父路由（或清除路由器插座）？ 角 5

Question

假設我的觀點是這樣的：

本地主機/主

  <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 。

但是我不想使用這樣的功能

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>

它返回到父網址。