Angular2迭代ngFor JSON文件

Question

I´m fairly new to Angular2, and i want to read out a json file. It´s working, that I get the file from a REST-Client, i can save the file in a local variable in a component. Now I´m trying to read properties (Array) with ngFor, but this isn´t working. Here´s the html:

<div *ngFor="let categories of tasks.tasks">
    {{categories}} --> Display name of categorie (epg, recs)
    <p *ngFor="let task of categories">{{task.text}}</p>
</div>

And the JSON-File:

{
    "tasks": {
        "epg": [{
            "text": "\\\\...\\Daten\\Videos\\Aufnahmen"
        }, {
            "text": "C:\\Users\\...\\Desktop"
        }],
        "recs": [{
            "text": "\\\\...\\Daten\\Videos\\Aufnahmen"
        }, {
            "text": "C:\\...\\Junias\\Desktop"
        }]
    }
}

Hope someone can help me ;)

Answer 1

Consider

z={
"tasks": {
    "epg": [{
        "text": "\\\\...\\Daten\\Videos\\Aufnahmen"
    }, {
        "text": "C:\\Users\\...\\Desktop"
    }],
    "recs": [{
        "text": "\\\\...\\Daten\\Videos\\Aufnahmen"
    }, {
        "text": "C:\\...\\Junias\\Desktop"
    }]
}

Modify your JSON as

  let a=this.z.tasks;
  this.z = Object.keys(a).map(function(k) { return a[k] });

Here is a plunker