Angular 角度：将函数传递给对象内部的服务

我有一个组件，我在其中传递我想要在模态中显示的内容，如下所示：

  openConfirmModal() {
    this.service.openmodal(
      {
        buttons: [ {name: 'Close'} ]
      }
    );
  }

模态服务如下所示：

  openmodal(input: String) {
    const dialogRef = this.dialog.open(popupComponent, {
      data: new ModalConfirmData({
        buttons: Object.values(data)[0]
      })
    });
  }

在我的popupComponent中，我有：

export class ModalPopupData {
  actions: Array<Object>;

  constructor(input?) {
    if (input) {
      this.buttons = input.buttons;
    }
  }
}

---

您的回调函数希望将一个

modalComponent

作为参数，但您的html在

（单击）=“act.callback”

中没有做任何排序

在您当前的代码中，您正在构造一个基本上如下所示的方法：

var myCallback = function(modalComponent) {
  modalComponent.close();
}
// ...
var someObj = {
  name: "Close",
  callback: myCallback
}

serviceFunction(callback?) {
  const cb = callback || (() => { });
  // do your services thing
  return cb();
} 

因此，我们最终需要做一些事情：

// ...
var modalComp = getComponent(); // however it gets hold of a modalComponent
someObj.callback(modalComp);

需要为该方法提供一个modalComponent来处理，但是在调用它时，您并没有在当前代码中提供它

因此，您当前对回调的调用需要提供您想要关闭的模式作为输入（类似于@ConnorsFan的注释，假设

此

是对该模式的相关引用），或者您将方法更改为已经知道该模式

var myModal = ...;
var myObj = {
  name: "Close",
  callback: () => { myModal.close(); }
}

现在的用法如下所示，因为没有输入参数：

myObj.callback();

---

匿名函数对于厚颜无耻地利用调用方作用域中不存在的资源非常有用。

就像按钮一样，您可以将方法/回调传递给服务，然后从服务内调用它们，例如

openConfirmModal() {
  this.service.openmodal({
    buttons: [ {name: 'Close'} ],
    methods: {
      onClose: () => {/** your function body goes here */},
      onSubmit: () => {/** your function body goes here*/}
      .
      .
      .
    }
  });
}

然后在你的服务中，你可以随时给他们打电话

也检查一下这个

---

您可以使用简单的javascript/typescript来解决这个问题，只需使用

回调方法

您的
服务功能将如下所示：

var myCallback = function(modalComponent) {
  modalComponent.close();
}
// ...
var someObj = {
  name: "Close",
  callback: myCallback
}

serviceFunction(callback?) {
  const cb = callback || (() => { });
  // do your services thing
  return cb();
} 

因此，当您调用它时，只需使用您想要使用的
回调函数调用
serviceFunction

考虑到在
组件中有
this.close（）
方法，调用
看起来像：

myService.serviceFunction(this.close);

您可以尝试从回调定义中删除
async
，并使用以下命令处理单击事件：
（单击）=“act.callback（this）”
。它不起作用：/能否将问题发布到stackblitz中，以便我们更好地解决它？因为您可以将
函数
作为
回调参数
毫无问题地传递。但是，当我这样做时，我得到了一个错误：error error:Uncaught（承诺中）：TypeError:modalComponent.close不是函数您的模态组件是否公开了公共
close（）
方法？您是如何获得对modalComponent的引用的？