我的JSON数组看起来像
Array(3)
main2=
[
0:{label: "Name", datatype: "text", lookupname: "null", order: 01"}
1: {label: "DOB", datatype: "date", lookupname: "null", order: "02"}
2: {label: "QRcode", datatype: "qrcode", lookupname: "null", order: "02"}
3: {label: "Image", datatype: "image", lookupname: "null", order: "02"}
]
我试图根据数据类型生成输入表单。但是我不能在循环中包含按钮,没有HTML标签在循环中起作用,只有诸如ion-something之类的标签起作用。当数据类型是条形码或二维码时,喜欢添加按钮循环
我的离子HTML
<form>
<ion-item *ngFor="let item of main2">
<ion-label fixed>{{item.label}} : </ion-label>
<ion-input type="text" name="title" *ngIf='item.datatype == "text"'></ion-input>
<ion-input type="text" *ngIf='item.datatype == "radio"'>Checkbox 1</ion-input>
<ion-input type="number" *ngIf='item.datatype == "number"'></ion-input>
<ion-datetime displayFormat="MMMM/DD/YYYY" *ngIf='item.datatype == "date"'></ion-datetime>
<ion-input type="file" name="title" *ngIf='item.datatype == "image"'></ion-input>
<ion-datetime displayFormat="HH:mm" *ngIf='item.datatype == "time"'></ion-datetime>
<ion-input type="number" *ngIf='item.datatype == "number"'></ion-input>
<ion-input type="text" *ngIf='item.datatype == "qrcode"' ></ion-input>
<ion-input type="text" *ngIf='item.datatype == "barcode"'></ion-input>
</form>
您的JSON数组缺少以下项的“ for order”字段:
0:{label: "Name", datatype: "text", lookupname: "null", order: 01"}
您的html缺少的结束标记 <ion-item>
要添加按钮:
(选项A)ion-item中的按钮:您必须使用特定的语法item-left
或item-right
(https://ionicframework.com/docs/2.3.0/api/components/item/Item/)
(选项B)离子项目作为按钮:您可以选择将离子项目作为按钮
的HTML
<ion-content>
<form *ngFor="let item of main2">
<ion-item>
<ion-label fixed>{{item.label}} : </ion-label>
...
//Option A
<button ion-button item-right *ngIf='item.datatype == "qrcode"'>Btn</button>
</ion-item>
//Option B
<button ion-item *ngIf='item.datatype == "qrcode"' (click)="test()">{{item.label}} Button</button>
</form>
</ion-content>
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句