Question

我点击选择城市点击它会突然出现两个城市一个是'bengaluru'而另一个是'hyderabad'如果点击那个bengaluru它必须显示该名称而不是选择城市..

home.html的：

<ion-header>

<button ion-button icon-only (click)="presentPopover($event)" >
    Choose City
    <ion-label>{{cityname}}</ion-label>
  <ion-icon name="arrow-dropdown"></ion-icon>
</button>

</ion-header>

home.ts：

import { PopoverController } from 'ionic-angular';


import { Component } from '@angular/core';
import {Popoverpage} from '../popoverpage/popoverpage';


@Component({
  selector: 'page-home',
   templateUrl: 'home.html'
})
export class HomePage {
  constructor(public popoverCtrl: PopoverController,
    ) {}

  presentPopover(myEvent) {
    let popover = this.popoverCtrl.create(Popoverpage);
    popover.present({
      ev: myEvent
    });
  }
}

popoverpage.ts：

import { Component } from '@angular/core';
import { NavController, NavParams } from 'ionic-angular';
import { ViewController } from 'ionic-angular';
import { Rest } from '../../providers/network/rest';
import { Logger } from '../../providers/logger/logger';

/*
  Generated class for the Popoverpage page.

  See http://ionicframework.com/docs/v2/components/#navigation for more info on
  Ionic pages and navigation.
*/
@Component({
  template: `
    <ion-list>
      <button ion-item (click)="store()">Bengaluru</button>
      <button ion-item (click)="fun()">Hyderabad</button>
    </ion-list>
  `
})

export class Popoverpage{
    store_id
  cityname


   constructor(public viewCtrl: ViewController,
     public params:NavParams,
    public navCtrl: NavController,
    public rest: Rest,
    public logger: Logger) {
   }

  store() {
    let  storeObj={
      store_id: '1'
    }

    this.logger.debug("checking the  " +JSON.stringify(storeObj));

    this.rest.post('/store',storeObj)
      .subscribe(result => {
        this.logger.debug("checking the data "+JSON.stringify(result));
        if(result.status == '1'){
          this.logger.info("success callback");
          // this.navCtrl.push("Homepage");
          this.params.get('cityname');

          //this.navCtrl.pop();
          this.viewCtrl.dismiss();

        }
        else{
          this.logger.info("error callback");
this.viewCtrl.dismiss();
        }
      })

  }

  fun() {
    let  storeObj={
      store_id: '0'
    }

    this.logger.debug("checking the  " +JSON.stringify(storeObj));

    this.rest.post('/store',storeObj)
      .subscribe(result => {
        this.logger.debug("checking the data "+JSON.stringify(result));
        if(result.status == '1'){
          this.logger.debug("success callback");
          this.params.get('cityname');
          //this.navCtrl.pop();
           this.viewCtrl.dismiss();
        }
        else{
          this.logger.debug("error callback");
           this.viewCtrl.dismiss();
        }
      })

  }

}

我该如何展示那件事

Answer 1

您可以使用dismiss传回数据并在onDidDismiss中设置回调。在popoverpage.ts中：

let data= cityname;//the variable containing the data to return
this.viewCtrl.dismiss({'city':data});

在你的家里。

  let popover = this.popoverCtrl.create(Popoverpage);

  popover.onDidDismiss(data=>{
     this.selectedCity=data.city;
  });

 popover.present({
      ev: myEvent
    });

如何在另一个页面中显示弹出窗口内容？

1 个答案: