我正在从事ionic 4项目。我的项目是使用输入搜索从url获取数据json。当用户单击项目以向他们显示另一个页面以获取更多详细信息时,我希望传递数据。我有一个很长的参数来传递到另一个页面。如果l事件onclick他仅接受参数!有没有办法一次传递所有参数?
应用路由模型
{ path: 'flightserachdetails/:callsign/:airport/', loadChildren: './flightserachdetails/flightserachdetails.module#FlightserachdetailsPageModule' }
主要代码
export class FlightsearchPage {
public search = ''
public flight : any
filterItems:any;
callsign : any;
constructor(private http: HTTP, public loadingController: LoadingController, private nav : NavController) {
this.addThemFunction
}
keyPressed(event: any) { /
console.log(event.target.value);
this.addThemFunction(event.target.value);
}
async addThemFunction(search){
this.http.get('/web/find?query='+search+'', {}, {})
.then(data => {
const parsed = JSON.parse(data.data);
this.flight = parsed.results;
this.filterItems= this.flight;
this.callsign = this.flight.detail.flight
}), err=>{
}
}
// navigate data to another page
navigate(callsign,airport,time){
this.nav.navigateForward(`/flightserachdetails/${callsign}/${airport}/${time}`);
}
用于显示和保持事件以将数据传递到另一个页面的
<ion-item *ngFor="let item of items" routerDirection="forward" >
<table (click)="navigate(item.flight.number.default,item.flight.airport.origin.position.region.city,item.scheduled.arrival)">
<tbody>
<tr >
<td >
<img src="/operators/{{item.flights.airlines.codes.icaos}}_logo0.png" (error)="handleImgError($event, item)" class="img-logo">
</td>
<td text-left>{{item.flight.number.default}}</td>
<td text-center>{{item.flight.airport.origin.position.region.city}}</td>
<td text-right>{{item.scheduled.arrival * 1000 | date:"h:mma"}}</td>
</tr>
<tr >
<td > </td>
<td ></td>
<td text-center>{{.aircraft.model.code}}</td>
<td text-right>{{item.status.generic.status.text}}</td>
</tr>
</tbody>
</table>
</ion-item>
您可以在这里看到这是我想要传递到另一页面的数据,因为它是如此之长,并且我有很多。
(click)="navigate(item.flight.number.default,item.flight.airport.origin.position.region.city,item.scheduled.arrival)">
这将使他将从url活动路由接收数据
callsign =null
airport = null
status = null
aircraft = null
airline = null
time = null
constructor(private http: HTTP, public loadingController: LoadingController,
private nav : NavController,private activatedRoute : ActivatedRoute) {
this.callsign = this.activatedRoute.snapshot.paramMap.get('callsign')
this.airport = this.activatedRoute.snapshot.paramMap.get('airport')
this.status = this.activatedRoute.snapshot.paramMap.get('status')
this.aircraft = this.activatedRoute.snapshot.paramMap.get('aircraft')
this.airline = this.activatedRoute.snapshot.paramMap.get('airline')
this.time = this.activatedRoute.snapshot.paramMap.get('time')
}
}
有没有一种方法可以总结我的代码以推送完整对象?