没有模式关闭后的点击事件?
No After click event on modal closing?
当我关闭模态时,我需要调用一个函数(使用表单控件来伪造或重置模态中的内容)但是我在点击后没有找到事件的任何处理程序,我该怎么做这个?
<clr-modal [(clrModalOpen)]="opened" [clrModalStaticBackdrop]="true">
...
</clr-modal>
谢谢。
[(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
我确实更喜欢第一个,因为在如此简单的 getters 和 setters 上,没有性能风险。但是我想既然我提到了去糖语法,我不妨举个例子。
当我关闭模态时,我需要调用一个函数(使用表单控件来伪造或重置模态中的内容)但是我在点击后没有找到事件的任何处理程序,我该怎么做这个?
<clr-modal [(clrModalOpen)]="opened" [clrModalStaticBackdrop]="true">
...
</clr-modal>
谢谢。
[(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
我确实更喜欢第一个,因为在如此简单的 getters 和 setters 上,没有性能风险。但是我想既然我提到了去糖语法,我不妨举个例子。