Question

在Ionic 4中，我想将数据从Popover控制器传递到视图页面。

我能够获取数据onDismiss()，但我想在不退出弹出窗口的情况下完成操作。

下面是我尝试过的onDismiss()代码段。

我们还有其他可以捕获的弹出方法或状态更改吗？

页面

async presentPopover(opts) {

    console.log(opts);
    const popover = await this.popoverController.create({
      component: RouteDetailsPopoverComponent,
      componentProps: {
        viewType: this.viewType
      },
      event: opts.event
    });

    popover.onDidDismiss()
    .then((result) => {
      console.log(result['data']);
      this.viewType = result['data'];
    });

    return await popover.present();
}

这是弹出框组件

changeRouteDetailView(mode: View) {
    this.viewType = mode;
    this.popCtrl.dismiss(this.viewType);
}

在不关闭弹出窗口的情况下，我可以将数据传回吗？

Answer 1

在您称为弹出框组件的页面中，在'create（）'和'present（）'方法之后键入以下内容以使用弹出框：

const { data } = await popover.onDidDismiss();

“数据”会将您从popover组件发送的值存储在称为popover组件的页面中。

同时，您需要在弹出框组件中将数据发送到页面。在需要从弹出窗口返回的方法中使用以下代码：

this.popoverCtrl.dismiss({ data_you_sent });

此method，dismiss（），返回数据（如果已发送），并关闭弹出窗口。

Answer 2

创建一个全局服务，并将其注入到两个组件中，从而通过该服务传递数据

Answer 3

this.popoverController.create({ 组件：RouteDetailsPopoverComponent，组件道具：{ someSubject: this.subject },

this.subject.subscribe(...)

在 POPOVER 中：

this.someSubject.next(..);

Answer 4

我能够在onDismiss（）上获取数据，但我想在不退出弹出窗口的情况下完成操作。

下面是我尝试过onDismiss（）的代码片段。

我们还有其他可以捕获的弹出方法或状态更改吗？

页我要在同一页面上分享您的src代码...？您能让我知道代码在哪里吗？ changeRouteDetailView(mode: View) { this.viewType = mode; this.popCtrl.dismiss(this.viewType); }

Answer 5

使用Observable将数据传回父级，而不会关闭。

在服务中

dataBS: BehaviorSubject<any> = new BehaviorSubject(null);
dataObs = this.dataBS.asObservable();

在POPOVER中

constructor(private dataSvc: DataService){}
sendToParent(val){
  this.dataSvc.dataBS.next(val);
}

在父组件中

constructor(private dataSvc: DataService){}
listenForData(){
 this.dataSvc.dataObs.subscribe(passedVal => {
   console.log(passedVal) // THIS is your value from popover in your parent without dismiss
 })
}

ngOnInit(){
 this.listenForData();
}

Answer 6

在您的 popOver 上，您可以使用：

JSON.stringify(test_json,null,3).replace(/([^}]?),\n( )*"/g, '$1,   "');

并且在您的页面中，您可以在present() 之后使用popover.onDIdDismiss() 事件来捕获从popover 返回的数据。：

class Properties(object):

     def __init__(self, driver):
     self.driver = driver
     
     def func1(self):
     name = self.driver.find_element_by_css_selector("#######").send_keys("******")

     def func2(self):
     self.driver.find_element_by_css_selector("######").send_keys(name)

离子4-从Popover传回数据，而无需关闭

6 个答案: