我有一张md-card内容,其中包含添加和删除按钮。打开页面时,我只需要添加按钮。当我点击添加按钮时,将打开另一个必须包含添加和删除按钮的md卡。现在一切都按照我的要求正常工作,但我没有隐藏主md卡中的删除按钮。请帮助。
HTML:
<md-card *ngFor="let positionDetails of positions; let i = index">
<div class="clearfix col-lg-12 col-md-12 col-sm-12 col-xs-12">
<button (click)="openAddPosition()" > + </button>
<h6 class="color-primary md-headline">Page</h6>
</div>
<button (click)="deletePosition(row_ind)" style="font-size: 35px;top: -6%; left: 0%;">-</button>
<div >
<md-input-container>
<input mdInput type="text" name="position" [(ngModel)]="positionDetails.position" [ngModelOptions]="{standalone: true}" required>
</md-input-container>
<md-input-container>
<input mdInput type="text" name="unit" [(ngModel)]="positionDetails.unit" [ngModelOptions]="{standalone: true}" required>
</md-input-container>
<md-input-container>
<input mdInput type="text" name="office_country" [(ngModel)]="positionDetails.office_country" [ngModelOptions]="{standalone: true}" required>
</md-input-container>
<md-input-container>
<input mdInput type="text" name="office_city" [(ngModel)]="positionDetails.office_city" [ngModelOptions]="{standalone: true}" required>
</md-input-container>
<md-input-container>
<input mdInput type="text" name="monthly_target" [(ngModel)]="positionDetails.monthly_target" [ngModelOptions]="{standalone: true}" >
</md-input-container>
<md-input-container>
<input mdInput type="text" name="wage" [(ngModel)]="positionDetails.wage" [ngModelOptions]="{standalone: true}" >
</md-input-container>
</div>
</md-card>
答案 0 :(得分:1)
如果您需要隐藏第一个/主要div的删除,可以查看index
以及0
是否可以hide it
<md-card *ngFor="let positionDetails of positions; let i = index">
...
...
<button *ngIf="i !== 0" (click)="deletePosition(row_ind)" style="font-size: 35px;top: -6%; left: 0%;">-</button>
</md-card>
答案 1 :(得分:0)
<强>主旨强>
你可以在这里做的是检查位置的长度,并在你的CSS中添加一个类,将visiblity设置为隐藏。
<强>模板强>
<button (click)="deletePosition(row_ind)" [ngClass]="{'style1': visibile}"></button>
<强>组件强>
检查位置长度是否更多,如果是,则将其视为false,否则为真。
<强> CSS 强>
.style1{
visiblity : hiddden;
}