时间戳

首页 > 解决方案 > 试图 ngFor 一个类的一个类

angular5 - 试图 ngFor 一个类的一个类

问题描述

我无法上课：这是我正在处理的实时代码： https ://stackblitz.com/edit/angular-62alpm?file=src%2Fapp%2Fshared.service.ts

@Injectable()
   export class Data{

   public data: types;
 }

@Injectable()
   export class types{

   public numb1: number;
   public numb2: number;
   public numb3: number;
   public numb4: number;
 }

代码：

//works
<div>
  {{_types.data.numb1}}
  {{_types.data.numb2}}
  {{_types.data.numb3}}
  {{_types.data.numb4}}
</div>

产生（对 ngfor 的期望——在不改变类结构的情况下需要相同的结果）：

 2
 3
 5
 7

在这里，我试图用 ngfor 产生同样的东西......不起作用

<div *ngFor="let test of _types.data">
  {{test}}
</div>

标签： angular5

解决方案

为了用 ngFor 循环一个元素，你的元素必须是一个数组。我建议您通过以下方式更改您的类型类：

@Injectable()
   export class types{

   public numbers: Array<number> = [];
 }

然后在数字中你推你的4个数字（numb1，numb2，numb3，numb4）

然后你可以像这样迭代它：

<div *ngFor="let test of _types.data.numbers">
  {{test}}
</div>

推荐阅读