ボタンなしで別のhtmlページに移動します。

Question

html/Angular 2の値に基づいて別のページにナビゲートする方法を知りたいと思います。値がtrueの場合、特定のページが読み込まれます。私は既にrouterLinkを使って別のページに移動するボタンを持っています。その機能を複製したいのですが、ボタンを使う代わりに、特定の値が真であればいつでもページがロードされます。値のチェックが発生している場所を見ることができる底部に

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

：

はここに私のメインのアプリのhtmlページです。たとえば、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']); 
}