ngx-bootstrap模态 - 通过bsModalRef.content

传递到模态的访问数据

我正在使用angular 4和ngx-bootstrap打开模态。所有工作都很好，我通过一个组件实现了模态。我也可以通过bsModalRef的content属性将数据传递到模态。像这样：ngx-bootstrap模态 - 通过bsModalRef.content

this.bsModalRef = this.modalService.open(MyComponent); 
this.bsModalRef.content.somedata = [...some array of products];

这一切都很好，然后我的模态可以访问一个名为somedata的属性。太棒了。我遇到的问题是我想对somedata执行一些计算。假设somedata是一个包含金额的产品列表，我希望模型将金额减少到单个值。我如何知道模态类中的数据何时可用？我可以使用一个setTimeout黑客，它可以工作，但会让我感到内心烦躁。有没有像ngOnChanges这样的生命周期钩ngx-bootstrap实现，所以我可以知道什么时候数据属性设置，并进一步，当它改变？

来源

2017-08-28 Greg

您可以实现二传手，或方法

记住this.bsModalRef.content由对话组件的所有公共成员（在你的情况为MyComponent）。

来源

2017-09-01 12:50:35

在父组件

import { Modal, BSModalContext } from 'ngx-modialog/plugins/bootstrap'; 
import { overlayConfigFactory } from 'ngx-modialog'; 

var dataObject = {data1: "ba vbal", data2 :"bla bla"}; 
this.modal.open(urmodalCpmponent, overlayConfigFactory({data: dataObject}, BSModalContext))

模态组件

import { DialogRef } from 'ngx-modialog'; 

constructor(public dialogRef: DialogRef){ 
let context:any = dialogRef.context; 
this.detail = context.data' 
}

来源

2017-12-30 16:15:37

一个更好的办法是使用initialState并通过你需要

this.bsModalRef = this.modalService.open(MyComponent, { 
initialState: { 
    products: [...some array of products] 
} 
});

请确保您有一个products什么阵列在MyComponent

export MyComponent { 
    public products: any[]; 
}

来源

2018-02-27 16:50:58

ngx-bootstrap模态 - 通过bsModalRef.content

回答

相关问题