如何绑定到bootstrap'在我的余烬观点中的模态事件

How do I bind to bootstrap's modal events in my ember view?

本文关键字:余烬 我的 观点 事件 模态 何绑定 绑定 bootstrap      更新时间:2023-09-26

我正在使用ember视图来呈现我的应用程序的模式介绍,目前它看起来是这样的:

views/moder.js

App.ModalView = Ember.View.extend({
    tagName: 'div',
    classNames: ['modal', 'fade'],
    templateName: 'modal',
    didInsertElement: function() {
        this.$().modal('show');
    }
});

控制器/应用程序.js

App.ApplicationController = Ember.ArrayController.extend({
    showModal: function() {
        var modal = App.ModalView.create();
        modal.append();
    }
});

modal.hbs模板只是一些样板html。

当我触发showModal函数时,我可以很好地显示模态,但在模态关闭后,我无法从DOM中删除视图,我正在尝试绑定到hidden事件,但我不知道如何,有人能给我指正确的方向吗?

我在现有的应用程序中使用了这种方法,并且运行良好

App.ModalView = Ember.View.extend({
    templateName: "modal",
    title: "",
    content: "",
    classNames: ["modal", "fade", "hide"],
    didInsertElement: function() {
        this.$().modal("show");
        this.$().one("hidden", this._viewDidHide);
    },
    // modal dismissed by example clicked in X, make sure the modal view is destroyed
    _viewDidHide: function() {
        if (!this.isDestroyed) {
            this.destroy();
        }
    },
    // here we click in close button so _viewDidHide is called
    close: function() {        
        this.$(".close").click();
    }
});

在这里,我们监听hidden事件,该事件在模态完全隐藏时触发,以销毁对象。这一点很重要,因为通过调用view.append()以编程方式创建的视图不会被破坏。这种方法确保了这一点。

这就是这个例子。