创建自定义durandal模式

时间:2014-07-22 20:50:03

标签: modal-dialog durandal

我正在尝试为durandal 2.1开发自定义模态插件以拥有我自己的逻辑并从我的应用程序的其余部分抽象它这是我到目前为止但是有些东西不能正常工作并且modal会在DOM中插入两次

define(['jquery', 'knockout', 'plugins/dialog'], function ($, ko, dialog) {    
var modal = {
    install: function (config) {
        dialog.addContext("Modal", {
            addHost: function (theDialog) {
                var body = $("body");
                $('<div id="Dialog" class="AlignC"><div class="ModalHost"></div></div>').appendTo(body);
                theDialog.host = $('#Dialog').get(0);
            },
            removeHost: function (theDialog) {
                alert("demoving host");
                $("#Dialog").remove();
            },
            compositionComplete: function (child, parent, context) {
                var theDialog = dialog.getDialog(context.model);
            }
        });
    }
};
return modal;

});

以下是我从viewmodel中调用它的方式

dialog.show(this, null, 'Modal');

任何人都可以告诉我这个代码的争论是什么为什么我的模型ELEMENT被插入两次并相互过度。我该怎么办呢。

第二个元素里面没有内容。

顺便说一句,这是我试图在模态中显示的视图

    <span class="Loader"></span>
    <div class="Modal">
        <h2 class="Caps">SomeName</h2>
        <div class="Row">
            <input type="text" />
        </div>
        <div class="Desc">
            description
            <br />
            XXY YYX XXY
        </div>
        <div class="Buttons">
            <span class="Green">Check</span>
            <span>Add</span>
        </div>
    </div>

1 个答案:

答案 0 :(得分:0)

好的,我设法解决了这个问题。点击绑定的问题是两次触发,这是在修复点击处理程序后在DOM中插入两个HTML元素相关的问题,一切正常。