在我的角度代码中,我得到了一个数组集合。当我绑定到角度html代码时,我逐列与mat-list和mat-list-item绑定。我的网格列例如是名称。所以我的网格看起来像这样
John Joe Mary Kim Steve Smith Coe Downs Carn Yeh
在我收集的ts中,它看起来像
data = [
{
firstname: ['John', 'Joe', 'Mary', 'Kim' 'Steve'],
lastname: ['Smith', 'Coe', 'Downs', 'Carn' 'Yeh']
}
];
在我的html代码中,我将得到第一列的名字
<div fxLayout="column" fxFlex>
<mat-list>
<mat-list-item *ngFor="let name of data">
{{name.firstname}}
</mat-list-item>
</mat-list>
</div>
<div fxLayout="column" fxFlex>
<mat-list>
<mat-list-item *ngFor="let name of data">
{{name.firstname}}
</mat-list-item>
</mat-list>
</div>
我只想获得第一列的第一个名称,并在下一列中获得第二个名称。
我的错误是我的第一列获取了数组中的所有名称。
谢谢
我google mat-item-list但是这些例子没有提供我想要做的任何线索。
我的网格列例如是名称。所以我的网格看起来像这样
约翰乔玛丽金史蒂夫史密斯科恩唐斯卡恩叶在我的收藏中,它看起来像
data = [
{ firstname: ['John', 'Joe', 'Mary', 'Kim' 'Steve'],
lastname: ['Smith', 'Coe', 'Downs', 'Carn' 'Yeh']
}
]
在我的HTML代码中,我会得到第一列的名字
<div fxLayout="column" fxFlex>
<mat-list>
<mat-list-item *ngFor="let name of data">
{{name.firstname}}
</mat-list-item>
</mat-list>
</div>
<div fxLayout="column" fxFlex>
<mat-list>
<mat-list-item *ngFor="let name of data">
{{name.firstname}}
</mat-list-item>
</mat-list>
</div>
刚想通了
<div fxLayout="column" fxFlex>
<mat-list>
<mat-list-item *ngFor="let name of data">
{{name.firstname[0]}}
</mat-list-item>
</mat-list>
</div>
<div fxLayout="column" fxFlex>
<mat-list>
<mat-list-item *ngFor="let name of data">
{{name.firstname[1]}}
</mat-list-item>
</mat-list>
</div>