@juanpa669 wrote:
Hi all,
I'm a newbie and try to turn it for hours so I hope someone can show me my errors, maybe ^^
So, I have a provider that calls a json
`import {Injectable} from 'angular2/core'; import {Http} from 'angular2/http'; import 'rxjs/add/operator/map'; /* Generated class for the Products provider. See https://angular.io/docs/ts/latest/guide/dependency-injection.html for more info on providers and Angular 2 DI. */ @Injectable() export class Products { constructor(http: Http) { this.http = http; this.products = null; } load() { if (this.products) { // already loaded data return Promise.resolve(this.products); } // don't have the data yet return new Promise(resolve => { this.http.get('./data.json').map(res => res.json()) .subscribe(data => { this.products = data; console.debug(this.products); }, err =>{ console.log("Erreur !!!!" + err.message); }); }); } }
`
The page1, Instanciate Products and call the Load function`import {Page} from 'ionic-framework/ionic'; import {Products} from '../../providers/products/products.js' @Page({ templateUrl: 'build/pages/page1/page1.html', providers: [Products] }) export class Page1 { constructor(products: Products) { this.products = products.load(); } }
`
And finally the template that make errors : EXCEPTION: Cannot find a differ supporting object '[object Object]' in [products in Page1@7:22]
`<ion-navbar *navbar> <ion-title>Title</ion-title> </ion-navbar> <ion-content padding class="page1"> <ion-list> <ion-item *ngFor="#product of products"> <ion-avatar item-left> <img [src]="{{product.img}}" /> </ion-avatar> <h2>{{product.title}}</h2> <p>{{product.desc}}</p> </ion-item> </ion-list> </ion-content>
`
Posts: 3
Participants: 2