首页 > 解决方案 > 如果从订阅中显示,Ngx-Bootstrap 模式不会刷新数据更改

问题描述

我正在尝试从组件打开一个模式,并且我正在调用 show 方法以响应另一个订阅,如果在订阅之外调用它可以正常工作。但是从订阅开始,传递给内容的数据并没有被刷新 下面是代码示例。

//Subscription
$subject.subscribe(res => {
  const bs_modal = this._bsModalService.show(ComponentA);
  bs_modal.content.data = res;

  this._bsModalService.onHide.subscribe(() => {
     console.log(bs_modal.content.res_data));
  })

})

// Modal Component
@Component({
  selector: 'app-modal',
  template: `
     <div>{{data | json}}<div>
     <button (click)="hideModal()">Hide Me</button>
  `,
})

class ComponentA {
  data: any;
  res_data: any;
  constructor(_bsModalRef: BsModalRef) {}

  hideModal() {
    this.res_data = 'Testing';
    this._bsModalRef.hide();
  }
}

在模态打开时data是空的,每当我关闭模态时res_data也是未定义的

标签: angularngx-bootstrap

解决方案


我已经在 stackblitz 中重新创建了您的代码,并且在调整了一些东西后,我能够将数据传递到模式中:https ://stackblitz.com/edit/angular-37iw9w

确保这些事情:

  • 您已导出 componentA 类。
  • 您已在模块中导入 ModalModule.forRoot()。
  • 您已将 componentA 添加到模块中的声明数组中。
  • 您已将 componentA 添加到模块中的 entryComponents 数组中。

这是基于您提供的代码示例的假设,即它们属于一个模块。


推荐阅读