在Angular 8中,你可以使用嵌套的ngFor循环来在HTML模板中获取数据。以下是一个示例代码:
在组件中定义数据:
export class AppComponent {
// 定义数据
public data = [
{
name: 'Array 1',
subArrays: [
{
name: 'Sub Array 1',
subSubArrays: [
{ name: 'Sub Sub Array 1' },
{ name: 'Sub Sub Array 2' }
]
},
{
name: 'Sub Array 2',
subSubArrays: [
{ name: 'Sub Sub Array 3' },
{ name: 'Sub Sub Array 4' }
]
}
]
},
{
name: 'Array 2',
subArrays: [
{
name: 'Sub Array 3',
subSubArrays: [
{ name: 'Sub Sub Array 5' },
{ name: 'Sub Sub Array 6' }
]
},
{
name: 'Sub Array 4',
subSubArrays: [
{ name: 'Sub Sub Array 7' },
{ name: 'Sub Sub Array 8' }
]
}
]
}
];
}
在HTML模板中使用嵌套的ngFor循环来获取数据:
-
{{ array.name }}
-
{{ subArray.name }}
-
{{ subSubArray.name }}
这样,你就可以在HTML模板中获取到数组中的另一个数组中的另一个数组的数据。