否在模态关闭的点击事件之后？答案

【问题标题】：No After click event on modal closing?否在模态关闭的点击事件之后？
【发布时间】：2017-10-21 07:32:12
【问题描述】：

当我关闭模式时，我需要调用一个函数（使用表单控件设置错误或重置模式中的内容）但单击后我没有找到任何事件处理程序，我该怎么做？

 <clr-modal [(clrModalOpen)]="opened" [clrModalStaticBackdrop]="true">
        ...
 </clr-modal>

谢谢。

【问题讨论】：

标签： angular vmware-clarity

【解决方案1】：

[(clrModalOpen)]="opened" 只是语法糖 [clrModalOpen]="opened" (clrModalOpenChange)="opened = $event" （请参阅https://angular.io/guide/template-syntax#two-way-binding--- 了解更多信息）。

因此，在您的情况下，事件处理程序是 (clrModalOpenChange)。另请注意，在 Angular 中，当更改来自双向绑定中的相应输入时，不会触发输出，因为它会导致循环。这意味着如果您自己的关闭按钮通过输入更新模式，则不会触发输出。解决方案只是确保从我们的输出和您自己的方法调用您的处理程序以关闭模式（如果有）。

因为我被要求提供一个现场示例，所以这里有两个：

优雅的 getter 和 setter 解决方案，保持双向绑定语法：https://plnkr.co/edit/7J8MfH?p=preview
带有脱糖版本的显式侦听器：https://plnkr.co/edit/6cWHwu?p=preview

我确实偏爱第一个，因为在这样简单的 getter 和 setter 上，没有性能风险。但我想既然我提到了去糖语法，我不妨举个例子。

【讨论】：

Eudes，你的解释很清楚。但我无法让它工作。你能举一个活生生的例子吗？此外，我猜您是开发 Clarity 的团队的一员。尽管我使用了一段时间，但我仍然无法从 Clarity 文档中完全获取所有内容（例如，这个 Banana-In-a-Box 表示法）。您是否有计划在您的文档中详细说明/改进（在需要时参考 Angular）？
@SoumyaKanti：我在答案中添加了几个 plunkers。关于文档，我认为重新记录 Angular 网站上已有的内容不是我们的职责。我们希望使用 Clarity 的人了解标准 Angular 模板语法和其他非 Clarity 功能。