0

How can I listen to events emitted from UIkit's Modal dialog in my Angular component?

I want to run some code when the modal is closed and have added (hidden)="onModalHidden()" on the modal div but the method is never being called.

HTML Template 

<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...');
}

I'm using Angular 4.4.5 and UIkit 3.

Any help/pointers would be appreciated.

4

2 回答 2

3

是的，为了阐明一些观点，您可以：

import * as uikit from 'uikit';

接着：

deleteUser(): void {
    uikit.modal.alert('Deleting user');
}

感谢丹卡

于 2018-04-28T22:07:54.350 回答
1

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

此外，UIkit 的编写方式与如今编写 js 组件的方式相同。您可以尝试导入它们，import * from 'uikit'看看会发生什么。我会走这条路，如果这还不够的话 - 专注于使用 javascript 设置组件，而不是通过标签属性。

于 2017-10-19T20:11:55.223 回答