Question

我想要一个模态组件来运行一个通过数据绑定传递给它的方法。我的意图是当模态被解除时，它将调用一个方法，该方法是对父组件的方法的引用。 NG2的正确方法是什么？

例如，我想要以下结构：

父组件html具有：

<some-modal-tag [callbackMethod]="parentComponentMethod"><some-modal-tag/>

在回答组件的子模态中我想做这样的事情：

@Input: callbackMethod;
onDismiss(){
  run(callbackMethod,args[]);
}

Answer 1

您应该在模式中使用@Output()：

@Output() dismiss = new EventEmitter();
private onDismiss(){
  // on close button click, or whatever closes this modal
  this.dismiss.emit('I'm dismissed.');
}

并在您的组件模板中：

<some-modal-tag (dismiss)="parentComponentMethod($event)"><some-modal-tag/>

Answer 2

<some-modal-tag [callbackMethod]="parentComponentMethod()"><some-modal-tag/>

@Input: callbackMethod;
  onDismiss(){
  callbackMethod();
}

parentComponentMethod() {
 return () => {
  // Your code here
 }
}

*注意使用箭头函数来保留闭合范围，如果没有它，回调将不一致地工作

Angular 2 - 输入绑定到回调方法引用

2 个答案: