为ngFor值添加ngIf条件

时间:2017-07-24 12:32:56

标签: angular angular-ng-if

我有一个ngFor,我带来了所有的数据。现在,如果状态为非活动状态,我需要隐藏一些按钮。我正在考虑使用ngIf。但我不知道如何为此写出条件。如何检查状态是否处于非活动状态并为这些状态添加NgIf条件?

<tbody id="address-list"  *ngIf="addressData">
   <tr *ngFor="let full of addressData " class="{{full.status}}style show-{{full.status}}" data-target="#address-details-modal" data-toggle = "modal" (click)="seperateId(full.ID)">
   <td class="{{full.status}}style show-{{full.status}}"  >
      {{full.address1}} {{full.address2}}
   </td>
   <td class="{{full.status}}style show-{{full.status}}">
      {{full.type}}
   </td>
   <td class="{{full.status}}style show-{{full.status}}">
      {{full.status}}
   </td>
   </tr>
</tbody>

现在,如果状态为非活动状态。当我编辑它。我应该隐藏编辑和删除按钮。

 <div class="modal-footer">
   <span class="action-btns" *ngIf="active">
   <button class="btn btn-primary btn-md edit-btn pull-left" title="Edits" id="edit-btn-address" (click)="editModal()"><span class="glyphicon glyphicon-pencil"></span></button>
   <button class="btn btn-danger btn-md delete-btn pull-left" title="Make Inactive" id="remove-btn-address" (click)="makeInactive()" ><span class="glyphicon glyphicon-trash" ></span></button>
   <button type="button" data-dismiss="modal" class="btn btn-default close-btn pull-right">Close</button>
   </span>
   <span class="edit-btns" *ngIf="edit" >
   <button type="button" class="btn btn-default cancel-btn" (click)="editm()">Cancel</button>
   <button type="button" data-dismiss="modal" class="btn btn-primary saveEqualBtn save-btn"    (click) = "TableUpdate(addressid.ID)" [disabled]="!addressHistory.form.valid" data-dismiss="modal">Save</button>
   </span>
   <span class="confirm-btns pull-left " *ngIf="inactive" >
   <span >Make Inactive?</span>
   <button type="button" class="btn btn-sm btn-default no-btn" (click)="makeInactive()" >No</button>
   <button type="button" class="btn btn-sm btn-danger yes-btn" data-dismiss="modal" (click)="AddressInactive(addressid.ID)" >Yes</button>
   </span>
</div>

为此我需要有一个ngIf值。所以点击那些将被隐藏。我怎么做??

1 个答案:

答案 0 :(得分:1)

如果你有你想要的财产,你可以比较它

<span class="confirm-btns pull-left " *ngIf="obj.property==='inactive'" >