在Angular中,你可以使用*ngFor指令来循环遍历包含数组的用户数据,并将其显示在HTML模板中。以下是一个示例代码:
在组件的typescript文件中,定义一个包含用户数据的数组:
import { Component } from '@angular/core';
@Component({
selector: 'app-user-list',
templateUrl: './user-list.component.html',
styleUrls: ['./user-list.component.css']
})
export class UserListComponent {
users = [
{ name: 'John', age: 25 },
{ name: 'Jane', age: 30 },
{ name: 'Bob', age: 35 }
];
}
在对应的HTML模板文件中,使用*ngFor指令来循环遍历用户数据数组,并将每个用户的信息显示出来:
-
{{ user.name }} - {{ user.age }}
这样,当你在浏览器中渲染这个组件时,它将显示一个无序列表,其中包含每个用户的姓名和年龄。
希望这个示例能帮到你!