2017-07-10 2 views
0

データテーブルprimengの​​列フィールドのアイコン形式でブール値を表現します。以下は、コードの一部です:PrimeNG DataTableで2つの異なるアイコン(真の場合は1つ、偽の場合)のブール値を表します。

<p-dataTable [value]="ARRAY_METADATA" rowHover="true"> 
    <p-column field="id" header="Field ID" [sortable]="true"></p-column> 
    <p-column field="booleanField" header="Boolean Field" [sortable]="true"></p-column> 
</datatable> 

はどうすれば真の値とのBooleanFieldのための偽の値については、「クロス」のために多分「ティック」と表示することが出来るのですか?

<span class="badge">BOOLEAN VAUE</span> 

純粋なHTMLの場合は、上記のコードがうまくいくと思います。しかし、再びブール値が異なるために2つの異なるアイコンを出力するために条件ステートメントをどのように置くと仮定しますか? 素早い考え?

ngIfを使用してみましたが、必要な方法が表示されません。これは単に、NG-テンプレートの内容を表示します。

<p-column field="someStringField" header="Some String Field"> 
    <div *ngIf="someStringField; else elseBlock"> 
     <button type="button" pButton icon="fa-check"></button> 
    </div> 
    <ng-template #elseBlock pTemplate="body" > 
     <button type="button" pButton icon="fa-times"></button> 
    </ng-template> 
</p-column> 
+0

にあるように、列に表示されるようにしたい任意のコンテンツを入れて持っていると信じています – BillF

答えて

0

は、私は以下の提案の回答を参照してくださいあなたはngのテンプレート

<ng-template let-col="rowData" pTemplate="body"> 
    <button *ngIf="col.someValue" type="button" pButton icon="fa-check"></button> 
    <button *ngIf="!col.someValue" type="button" pButton icon="fa-times"></button> 
</ng-template> 
関連する問題