角度2替換當前元素

Question

我想在進行路由而不是附加時替換當前元素。 例如我的代碼如下：

<router-outlet>
    <div class="=row" style="height:30%"></div>
    <div class="=row">
        <a routerLink="search" routerLinkActive="active" class="btn btn-success btn-sm" style="width:90%;height:20%;margin-left:5%">
            <span class="glyphicon glyphicon-search"></span> Search1
        </a>
    </div>
    <div class="=row" style="height:30%"></div>
    <div class="=row">
        <button type="button" class="btn btn-success btn-sm" style="width:90%;height:20%;margin-left:5%">
            <span class="glyphicon glyphicon-plus"></span> Search2
        </button>
    </div>
</router-outlet>

但是，最終結果如下圖所示：

搜索文本來自searchCOmponent路由。 我想要的是當我單擊search1，search 1和search 2時消失了，取而代之的是從searchComponent加載的“測試搜索”文本。 這就是為什么我將“ route-outlet”標簽作為父標簽。 我希望它能取代整個身體。 有人可以幫忙嗎？ 謝謝。

Answer 1

這不是路由器插座的正確用法。 它不應包含任何內容。 而是，路由器會自動填充路由器插座，從而為您提供所需的結果。

有關更多信息，請參閱文檔： https : //angular.io/docs/ts/latest/guide/router.html#!#sts= src%2Fapp%2Fapp-routing.module.ts%20( appRoutes）