Question

我正在使用一个余烬视图来渲染我的应用程序的模态介绍，目前它看起来像这样：

视图/ modal.js

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

控制器/ application.js中

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

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

我可以在触发showModal函数时显示模态，但是在模态关闭后我无法从DOM中删除视图，我正在尝试绑定到{{1事件，但我无法弄清楚如何，有人能指出我正确的方向吗？

Answer 1

我在现有应用中使用了这种方法，效果很好

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()）不会被破坏。这种方法可以确保它。

这是示例中的jsfiddle。

如何在我的ember视图中绑定bootstrap的模态事件？

1 个答案: