0
イオンリストに表示するために、画像のIDとそのURLを含むjsonオブジェクトがあります。以下のコードを試しますが、画像は表示されません。表示されません。ここimage jsonオブジェクトをイオンリストに表示する(v2)
About.html
<ion-content padding>
<ion-list>
<ion-item *ngFor="let post of posts">
<img [src]="post.pic"/>
</ion-item>
</ion-list>
</ion-content>
は私のJSONオブジェクトです:
{"ListeImages":[{"id":"44","pic":"https:\/\/stationpfe.000webhostapp.com\/projet\/uploads\/1494201248244.jpg"}],"success":1}
About.ts
import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import {Imageservice} from '../../providers/imageservice';
import { Http } from '@angular/http';
@Component({
selector: 'page-about',
templateUrl: 'about.html',
providers:[Imageservice]
})
export class AboutPage {
posts: any;
constructor(public navCtrl: NavController,public im:Imageservice,public http: Http) {
this.getImages();
}
getImages(){
this.im.OneArrive().subscribe(response=>
{
this.posts=response.ListeImages;
});
}
}
imageservice.ts(プロバイダ)
import { Injectable } from '@angular/core';
import { Http } from '@angular/http';
import 'rxjs/add/operator/map';
@Injectable()
export class Imageservice {
constructor(public http: Http) {
console.log('Hello Imageservice Provider');
}
public OneArrive(){
var url='https://stationpfe.000webhostapp.com/projet/SelectListeImages.php';
return this.http.get(url).map(res=>res.json());
}
}
....それが役に立てば幸いURLがそこに表示されていない場合 – rashidnk
あなたの購読 –
セットAでエラーコールバックを設定し、、ウルJSONとprvblmをIMGのsrcクロムコンソールの値をチェックconsole.log on this.posts、データが実際に返されたか、リクエストしたのがエラーを返しましたか? @浦二さんのように、エラーコールバックを設定してエラーをキャッチします。 – TriDiamond