我有一个列表的项目,我循环通过和显示在一个div。这些在初始页面加载时呈现。
<button (click)="addCut()" mat-raised-button color="primary">Add New Cut</button>
<button (click)="addCut()" mat-raised-button color="primary">+</button>
<div class="cutcontainer" style="margin-top:10px;" *ngFor="let i of details.cutsAndPrices; let index = index;">
<mat-form-field class="cutitem">
<input matInput placeholder="Cut"> {{i.type}}
</mat-form-field>
<mat-form-field style="margin-right:15px;">
<input matInput placeholder="Price"> {{i.price}}
</mat-form-field>
<button (click)="removeCut(index)" mat-raised-button color="warn" id="{{i.type}}">-</button>
</div>
我正在寻找一种方法,当我点击第一个按钮时,它调用addCut(),将一个项目添加到列表中,然后更新页面上的html。
或者,如果更简单,只需添加
<mat-form-field class="cutitem">
<input matInput placeholder="Cut">
</mat-form-field>
<mat-form-field style="margin-right:15px;">
<input matInput placeholder="Price">
</mat-form-field>
<button (click)="removeCut(index)" mat-raised-button color="warn" id="">-</button>
当我点击addCut()
的时候,包含div的内部。
希望这是有意义的,提前感谢
1条答案
按热度按时间i86rm4rw1#
在.ts文件中: