1

我在引导模式中有一些表单和 div，当单击 div 时，它会添加一些 css 类来更改外观，并在表单中输入一些内容，现在当我关闭模式并再次打开它时，表单输入并添加 css 类是仍然在那里，我希望每当模式打开时，它应该是一个新的。所以我找到了一个解决方案：

$('#modal).on('hidden',function(){
     $(this).removeData('modal')
})

这个想法是，Bootstrap 将在第一次 modal() 触发时实例化一个模态，并向模态元素添加一些数据模态，当下一个 modal() 触发时，它只显示隐藏的旧模态实例，而不是创建新的，所以上面的方法尝试删除data-modal属性，强制Bootstrap实例化一个新的modal。

但它似乎不适用于角度，这就是我所拥有的：

 <div class='row' >
    <div class='span14' >
        <div data-new-modal='new_item_modal' id='new_item' class='item' >create</div>
    </div>
</div>

<div id='new-item-modal' data-item-modal>
     // modal body
</div>

有角度的

directive.newItem = function(){
    return {
        restrict:'A',
        link:function(scope,element,attrs){
            element.bind('click',function(){
                $('#'+attrs.newItem).modal();
            });
        }
    };
};

directive.itemModal = function(){
    return {
        restrict:'A',
        link:function(scope,element,attrs){
            element.on('hidden',function(){
                console.log(element.data('modal'))
                                    element.removeData('modal') // wont work
                //scope.$apply(element.removeData('modal')) wont work either
                console.log(element.data('modal'))
            })
        }
    }
};

知道如何以角度重置引导模式吗？

而且我只是发现即使我刷新页面有时模态仍然保持不变！

4

1 回答 1

1

查看 javascript 插件代码。工具提示和弹出框都具有破坏功能。由于某种原因，模态缺少这样的功能。

尝试向模态插件添加销毁功能或以相同的方式销毁您的模态：

, destroy: function () {
  this.hide().$element.off('.' + this.type).removeData(this.type)
}

使用 twitter 引导程序创建工具提示/弹出框后的回调函数？向您展示如何扩展插件功能。在这种情况下，您可以扩展 hideModal 函数。

        var tmp = $.fn.modal.Constructor.prototype.hideModal;
        $.fn.modal.Constructor.prototype.hideModal = function () {
          tmp.call(this);

          /*reset your modal here */


        }

隐藏模式后，您可以重置表单输入并删除该类。有关示例，请参见：http ://bootply.com/66189。

如果你每次都使用 angularjs 在你的 dom 中插入一个新的模态，你可以使用上面的方法在隐藏时将其删除。

于 2013-06-28T11:29:33.897 回答