每一列資料是由angular遍歷產(chǎn)生
效果如下圖:
因為左側(cè)名稱文字多少不同,所以右側(cè)資料會出現(xiàn)偏上顯示情況,已經(jīng)試了display: table-cell;
vertical-align: middle;,但沒效果,也試了用line -height設置,但也不行,求大神指點,多謝??!
程式碼結(jié)構(gòu)是這樣的:
<ion-row *ngFor="let row of config.rows">
<ion-col col-3>{{row.rowName}}</ion-col> <!-- 左側(cè)名稱 -->
<ion-col *ngFor="let col of row.cols">{{col.data.value}}</ion-col> <!-- 右側(cè)數(shù)據(jù) -->
</ion-row>
右側(cè)三列資料是統(tǒng)一遍歷產(chǎn)生的
使用ionic的align-self-center,發(fā)現(xiàn)表格的框線會出問題,求解啊啊啊啊啊
#<ion-row *ngFor="let row of config.rows">
<ion-col col-3> {{row.rowName}}</ion-col>
<ion-col align-self-center>
<ion-row>
<ion-col *ngFor="let col of row.cols">{{col.data.value}}
</ion-col>
</ion-row>
</ion-col>
</ion-row>