,感谢您的帮助。 我在后端服务器中创建了很多json,如下所示:
Json1
[{"idtessera":"314","cognome":"xxx","nome":"xxx","sommagol":"5","idsquadra":"56","squadra":"xxx","idtorneo":"2","descrizione":"xxx","log":"url"},{"idtessera":"224","cognome":"xzxz","nome":"xzxz","sommagol":"4","idsquadra":"5","squadra":"xzxzxz","idtorneo":"2","descrizione":"SERIE B","log":"url"}]
Json2
[{"idsquadra":"314","squadra":"xxx","tipo":"xxx","stagione":"2018\/2019","idtorneo":"3","descrizione":"xxx","foto_squadra":"url","logo_squadra":"url"},{"idsquadra":"9","squadra":"xzxz","tipo":"xzxz","stagione":"2018\/2019","idtorneo":"3","descrizione":"zxzx","foto_squadra":"","logo_squadra":""}]
在我的应用程序中,我创建了一个用于存储(在本例中)所有“ squadra” obj的服务;这是我的提供者:
squadre.ts
import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';
import 'rxjs/add/operator/map';
import { Observable } from 'rxjs/Observable';
import { map, catchError } from 'rxjs/operators';
/*
Generated class for the SquadreProvider provider.
See https://angular.io/guide/dependency-injection for more info on providers
and Angular DI.
*/
@Injectable()
export class SquadreProvider {
private apiUrl = 'http://xxx.json';
constructor(public http: HttpClient) {
}
getSquadre() {
return new Promise(resolve => {
this.http.get(this.apiUrl).subscribe(data => {
resolve(data);},
err => {
console.log(err);
});
});
}
现在,例如,我有一些页面,其中以如下方式显示json 1的数据:
page-datajson1.ts
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { LoadingController } from 'ionic-angular';
import { ModalController } from 'ionic-angular';
import { ProfiloSquadraPage } from '../../profilo-squadra/profilo-squadra';
import { Http } from '@angular/http';
import 'rxjs/add/operator/map';
@IonicPage()
@Component({
selector: 'page-marcatori-serie-a',
templateUrl: 'marcatori-serie-a.html',
})
export class MarcatoriSerieAPage {
marcatoris : any = [];
constructor(
public navCtrl: NavController,
public navParams: NavParams,
public loading: LoadingController,
public http: Http,
public modalCtrl: ModalController ) {
this.http.get('http://xxx.json').map(res => res.json()).subscribe(data => {
this.marcatoris = data;
});
}
public test(event ,idsquadra ){
this.navCtrl.push(ProfiloSquadraPage,{
idsquadra:this.marcatori.idsquadra
});
}
}
marcatori-page.html
<ion-content padding>
<ion-list>
<ion-item class="playeritem" *ngFor="let marcatori of marcatoris ; let i = index" [attr.data-index]="i" >
<button ion-button clear class="nome" > {{i+1}} | {{marcatori.cognome}} {{marcatori.nome}} </button>
<span style="float:right" class="voto">{{marcatori.sommagol}}</span><br />
<button ion-button clear (click)="test($event, idsquadra)"">
<img src={{marcatori.log}} onError="this.src='assets/imgs/logo_squadra.jpg'" width="24px"> <h4 style="padding: 2px; color:black;">{{marcatori.squadra}} </h4> </button>
</ion-item>
</ion-list>
</ion-content>
如果您在我的公共函数test()中看到,我使用navctrl来存储marcatori obj的idsquadra,并按下“详细信息-quadros”(profilosquadra)页面。
现在,如何在squadreprovider数组中检查传递的ID并在profilosquadra中显示正确的数据? 这样正确吗?