Question

我想知道如何根据html / Angular 2中的值导航到不同的页面。如果值为true，则会加载特定页面。我已经有使用routerLink导航到不同页面的按钮 - 我想复制该功能但不是使用按钮，只要特定值为true，页面就会加载。

这是我的主要应用程序html页面：

<p-toolbar>
    <div class="ui-toolbar-group-left">
        <button pButton type="button" label="Home" routerLink="/"></button>
    </div>

    <div class="ui-toolbar-group-right">
        <button pButton type="button" label="About" routerLink="/about"></button>
        <button pButton type="button" label="Page1" routerLink="/page1"></button>
        <button pButton type="button" label="Page2" routerLink="/page2"></button>
        <i class="fa fa-bars"></i>
    </div>
</p-toolbar>
<br />

<!--Implement page routing here...-->
<div *ngIf="valueCheckComplete">
    <div *ngIf="showPage1"></div>
    <div *ngIf="showPage2"></div>
</div>

在底部，您可以看到值检查的位置。如果例如showPage1为真，我将如何加载页面？处理这些值的所有功能都已在我的TypeScript文件中实现，我只需要知道如何根据值导航到不同的页面，而不是按钮单击。

Answer 1

想出来。我没有在我的html页面中路由到页面，而是在我的typescript文件中使用了一个Router对象。

constructor(private router: Router, ...){
    // set boolean here
}

goToPage()
{
    if(this.showTuner)
        this.router.navigate(['/tuner']);   
    else if(this.showProcessor)
        this.router.navigate(['/processor']);   
}

无需按钮即可导航到不同的html页面。

1 个答案: