从 Ionic4 Modal [object Object] 返回数据

Posted 2023-02-23

【中文标题】从 Ionic4 Modal [object Object] 返回数据

【英文标题】：Returning data from Ionic4 Modal [object Object]

【发布时间】：2019-03-02 07:12:34

【问题描述】：

我正在尝试在 Home Page 中创建一个模态窗口，将其传递给一个单选组，当用户从该单选组中选择一个值时，然后让我的模态再次将他们选择的对象传回主页.

广播组页面和html

  export class PopoverstationsPage implements OnInit 

      cities :any

      constructor(public nav : NavController,public nav : NavController,public modalController: ModalController ,public router : Route)  

      ngOnInit() 
        console.log(this.cities)
      

      onRadioChange(cities: Tab1Page):void 
    this.modalController.dismiss(cities);

      console.log(this.cities)
  

    

html

<ion-list>
        <ion-radio-group (ionChange)="onRadioChange()" [(ngModel)]="cities">
            <ion-list-header>
                <ion-label>Name</ion-label>
            </ion-list-header>

            <ion-item>
                <ion-label>ميناء خصب</ion-label>
                <ion-radio slot="start" value="26.2105,56.244" ></ion-radio>
            </ion-item>

            <ion-item>
                <ion-label>مطار خصب</ion-label>
                <ion-radio slot="start" value="26.161722,56.23672"></ion-radio>
            </ion-item>
            <ion-item>
                <ion-label>دبا</ion-label>
                <ion-radio slot="start" value="25.615627,56.247322"></ion-radio>
            </ion-item>
            <ion-item>
                <ion-label>البريمي</ion-label>
                <ion-radio slot="start" value="24.233913,55.916176"></ion-radio>
            </ion-item>

        </ion-radio-group>
  </ion-list>

首页接收上述表单页面的值，然后在测试功能天气中使用它

     export class HomePage implements OnInit 

              cities :any

              constructor(public nav : NavController,public modalController: ModalController)  

              ngOnInit() 
                console.log(this.cities)
              

            async openUserModal() 
           const modal = await this.modalController.create(
         component: PopoverstationsPage,
        componentProps:  cities: this.cities ,
      );

      modal.onDidDismiss()
        .then((data) => 
          const cities= data
          console.log(cities)
      );

      return await modal.present();
    


async test ()

  this.https.get('weather/'+this.cities+'.json')
  .subscribe(data => 

    this.weather = data

  )




 

当数据 ara 返回时，我在 onDidDismiss 中得到了 [object Object]！请问有什么办法吗？

【问题讨论】：

你在哪里看到object object哪一行？

在控制台modal.onDidDismiss().then((data) => this.testy = data console.log('test '+this.testy); )

【参考方案1】：

要查看实际数据，需要按如下方式进行 JSON.stringify，

modal.onDidDismiss()
        .then((data) => 
          const cities= data;
          console.log(JSON.stringify(cities));
);

【讨论】：

只有这个我进入了控制台！ "data":

表示没有数据

但页面弹出窗口中有数据显示它控制台！但代码返回数据为空

【参考方案2】：

终于修好了

  modal.onDidDismiss().then((r) => 
    console.log("the result:", r , 'test'+ this.testy);

    this.testy = r.data.result
);