角度タブの条件テスト

Question

私はタブがあります。

<li><a href="#tab_2-2" target="_self" data-toggle="tab">Test</a></li>

私は最初のタブにtestというチェックボックスがチェックされていない場合は、タブを無効にすることを必要とします。

私はそれを角度で行う必要があります。

Answer 1

Htmlアンカーには無効なプロパティがありません。

あなたは

隠し

<li><a href="#tab_2-2" target="_self" data-toggle="tab" [hidden]="!test">Test</a></li> 

を使用することができますまたはあなたはHREFを削除し、CSSスタイルに、これは参考になる

<li><a [href]="test? # : #tab_2-2" [class.disabled]="!test" target="_self" data-toggle="tab">Test</a></li> 

希望を変更するには無効なクラスを追加するための条件を使用することができます。

Answer 2

タブに変数を設定して、それに基づいて[disabled]を設定することができます。

enableTab = false;

<tab [disabled] = "enableTab"> 

あなたはtab1の上であなたのチェックボックスをチェックする場合、trueにTS

enableTab(){ 
    this.enableTab= true; 
}