角度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，搜索1并搜索2消失并替换为＆＃34;测试搜索＆＃34;从searchComponent加载的文本。这就是为什么我把＆＃34;路由出口＆＃34; tag作为父标记。我希望它取代整个身体。有人可以帮忙吗？感谢。

Answer 1

这不是路由器插座的正确用法。它不应该有任何内容。相反，路由器会自动填充路由器插座，为您提供所需的结果。

有关详细信息，请参阅文档：https://angular.io/docs/ts/latest/guide/router.html#!#sts=src%2Fapp%2Fapp-routing.module.ts%20(appRoutes)