Tenho um arquivo nvi.json
que está desta forma:
[
{
"abbrev": "gn",
"book": "Gênesis",
"chapters": [
{
"1": {
"1": "...",
"2": "..."
}
},
{
"2": {
"1": "...",
"2": "..."
}
},
{
"3": {
"1": "...",
"2": "..."
}
}
]
}
]
E estou acessando assim:
export class BookPage {
public chapters: Array<string>;
private url: any = "../../assets/nvi.json";
constructor(public navCtrl: NavController, private NavParams: NavParams, public http: Http) {
let id = NavParams.get('id');
this.http.get(this.url).map(res => res.json())
.subscribe(data => {
this.chapters = data[id].chapters[0];
console.log(this.chapters);
});
}
this.chapters
retorna o primeiro capítulo onde contem os versículos, mas eu não estou conseguindo fazer um loop
destes versículos.
<div *ngFor="let item of chapters">
{{item}}
</div>
Console:
EXCEPTION: Error in ./BookPage class BookPage - inline template:33:5 caused by: Cannot find a differ supporting object '[object Object]' of type 'object'. NgFor only supports binding to Iterables such as Arrays.