4

我ui.bootstrap.datepickerPopup在里面的一个过滤器头模板中使用ui.grid。这让我可以按日期过滤行。我在网格菜单中还有一个按钮，可以切换grid.options.enableFiltering.

由于与 的对齐问题ui-grid，我已将datepicker-append-to-body我的日期选择器设置为 true。我第一次启用过滤时，一切正常。但是，当我禁用过滤并重新启用它时，我会得到重复的日期选择器。

这就是问题的样子：

我认为问题在于每次启用过滤器时，以下内容div都会附加到 DOM 中，并且在禁用过滤器时永远不会删除。

<div uib-datepicker-popup-wrap=""
     ng-model="date"
     ng-change="dateSelection(date)"
     template-url="uib/template/datepickerPopup/popup.html"
     class="ng-pristine ng-untouched ng-valid ng-scope ng-empty ng-valid-date-disabled"
>
    <!-- ngIf: isOpen -->
</div>

这是一个简化的 plunker： http
://plnkr.co/edit/eYZt87j2O6A5xhjHj5ZG 如果我只在Time Range过滤器标题中使用一个日期选择器，我会遇到同样的问题。

任何想法都非常感谢！不想使用 jQuery。

4

1 回答 1

1

我没有关于为什么会发生这种情况的答案，但是没有 jQuery 的解决方案是在使用 document.querySelectorAll() 触发过滤器切换时删除弹出窗口

var elements = document.querySelectorAll("div[uib-datepicker-popup-wrap]");
Array.prototype.forEach.call(elements, function(node) {
     node.parentNode.removeChild(node);
});

戳这里

于 2017-09-07T18:27:14.063 回答