角度2:对于复杂的物体

时间:2017-11-02 13:35:26

标签: angular ngfor

我在使用ngofr

的角度2中显示复杂对象时遇到问题
jobs = [
    new Job('MacGronalds', [
        new Position("Sweeper"),
        new Position("burger flipper")
    ]),
    new Job('Starduck', [
        new Position("Sweeper"),
        new Position("burger flipper")
    ])
];

如何像这样迭代我的对象?

<li *ngFor="let job of jobs">
    {{ job.companyName }}
    <div *ngFor="let position of job">
        {{position.name}}
    </div>
</li>

谢谢!

2 个答案:

答案 0 :(得分:2)

您的模型应如下所示。

    export class Job{
    constructor(
        public companyName : string,
        public positions: Position[]
   ) { }
}

  export class Position{
    constructor(
        public name: string
   ) { }
}

并且您有一个存储private jobs : Job[];

等作业的字段

然后你可以循环使用以下

<li *ngFor="let job of jobs">
    {{ job.companyName }}
    <div *ngFor="let position of job.positions">
        {{position.name}}
    </div>
</li>

答案 1 :(得分:1)

假设&#34;职位&#34;是一个名为&#34;职位&#34;的工作中属性的数组,您需要做的就是:

<div *ngFor="let position of job.positions">