在Angular 2中,ngFor是一个内置的指令,用于在模板中循环遍历数组或集合。要从ngFor数组中获取特定值,可以使用以下步骤:
items: any[] = [
{ id: 1, name: 'Item 1' },
{ id: 2, name: 'Item 2' },
{ id: 3, name: 'Item 3' }
];
<div *ngFor="let item of items">
<ng-container *ngIf="item.id === 2">
{{ item.name }}
</ng-container>
</div>
在上面的代码中,我们使用ngFor指令循环遍历items数组,并使用ngIf指令来筛选出id等于2的项。然后,我们通过插值表达式{{ item.name }}来显示该项的名称。
const item = this.items.find(item => item.id === 2);
const itemName = item ? item.name : '';
在上面的代码中,我们使用数组的find方法来查找id等于2的项,并将其名称存储在itemName变量中。如果找不到匹配的项,itemName将为空字符串。
总结:
ngFor是Angular 2中用于循环遍历数组或集合的内置指令。要从ngFor数组中获取特定值,可以使用*ngIf指令在模板中筛选出特定项,或者在组件类中使用数组的find方法来获取特定项。
领取专属 10元无门槛券
手把手带您无忧上云