收听Angular 4组件中的UIkit模态事件

Question

如何在我的Angular组件中监听UIkit的Modal对话框发出的事件？

我想在模态关闭时运行一些代码，并在模态div上添加(hidden)="onModalHidden()"，但该方法从未被调用。

HTML模板

<div id="modal-user-data" uk-modal (hidden)="onModalHidden()"> 
 
    <div class="uk-modal-dialog uk-modal-body uk-overflow-auto"> 
 
    <h4 class="uk-modal-title uk-heading-divider">Header</h4> 
 
    <p>Some Content</p> 
 
    <p class="uk-text-right"> 
 
     <button class="uk-button uk-button-default uk-modal-close" type="button">close</button> 
 
    </p> 
 
    </div> 
 
</div>

Component.ts

onModalHidden() { 
 
    console.log('Never called...'); 
 
}

我使用角4.4.5和UIkit 3.

任何帮助/指针，将不胜感激。

Answer 1

我从来没有将它们一起使用过，但根据文档，您可以在React中使用UIkit。只记得使用data-uk属性而不是仅使用uk属性。

此外，UIkit的编写方式是现在写js组件。您可以尝试使用import * from 'uikit'导入它们，看看会发生什么。我会这样做，如果它不够 - 专注于使用JavaScript来安装组件，而不是使用标签属性。