1

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

意见/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 中删除视图，我正在尝试绑定到hidden事件但我不知道如何，可以有人指出我正确的方向吗？

4

1 回答 1

2

我已经在现有应用程序中使用了这种方法，并且效果很好

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当modal完全隐藏时触发的事件来销毁对象。这很重要，因为以编程方式创建的视图调用view.append()，不会被破坏。这种方法可以确保它。

这是带有示例的jsfiddle。

于 2013-08-05T18:59:11.843 回答