有没有一种方法可以在页面之间一次推送数据?

时间:2019-02-10 15:40:16

标签: angular ionic4

我正在从事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 >&nbsp;</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')           


   }



}

有没有一种方法可以总结我的代码以推送完整对象?

0 个答案:

没有答案