我想单击一个按钮，单击该按钮时会插入一行：
<ion-grid>
<ion-row>
<ion-col>
1 of 2
</ion-col>
<ion-col>
2 of 2
</ion-col>
</ion-row>
</ion-grid>
<button (click)="addrow"></button>
在打字稿方面：
addrow(){
//code
}
你知道任何使用 ionic 2 和 typescript 的例子吗？
您可以使用数组动态添加行。请看看这个 plunker。请注意，在 plunker 中，我还使用了一个maxQuantity属性来禁用按钮（并避免将新行添加到网格中）。
风景：
<ion-header>
<ion-navbar>
<ion-title>Ionic Demo</ion-title>
</ion-navbar>
</ion-header>
<ion-content padding>
<ion-grid>
<ion-row *ngFor="let row of rows">
<ion-col>
{{ row?.firstCol }}
</ion-col>
<ion-col>
{{ row?.secondCol }}
</ion-col>
</ion-row>
</ion-grid>
<button ion-button [disabled]="rows?.length === maxQuantity" (click)="addrow()">Add a row</button>
</ion-content>
组件：
@Component({...})
export class HomePage {
public rows: Array<{ firstCol: string, secondCol: string }> = [];
private maxQuantity: number = 5;
constructor() {}
public addrow(): void {
this.rows.push({ firstCol: '1 of 2', secondCol: '2 of 2' });
}
}
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句