切换 ng-show 时 slideToggle 函数停止工作
slideToggle function stops working when toggling ng-show
我有两个按钮,它们使用 ng-show 更改视图,我在默认视图上有一个过滤器。 Filter 是一个与 SlideToggle() 一起使用的下拉菜单,它一直有效,直到我单击另一个按钮并转到第二个视图,当我单击返回到默认视图时,下拉菜单停止工作。
我在 Chrome 中检查过它,没有任何反应
这是下拉菜单的代码:
<div ng-if="filter.entity === 'user'" class="col-md-12 filter-group">
<h5 class="open">Age<span class="caret"></span></h5>
<div class="filter-group-items filter">
<div>Age
<rzslider rz-slider-model="filter.ageMin" rz-slider high="filter.ageMax" rz-slider-options="sliderOptionsAmount">
</rzslider>
</div>
<div>
</div>
这是 js
$(".open").click(() => {
$(".filter").slideToggle()
})
问题与 AJAX 加载内容上的绑定事件相同,参见 How to bind Events on Ajax loaded Content?
jQuery 动态内容的事件绑定应如下所示:
$(document).on("click", ".open", () => {
$(".filter").slideToggle();
});
我认为可能是 JQuery 正在更新 DOM 而 angular 不知道。我会尝试在 angular 中完成所有操作,它会起作用
我有两个按钮,它们使用 ng-show 更改视图,我在默认视图上有一个过滤器。 Filter 是一个与 SlideToggle() 一起使用的下拉菜单,它一直有效,直到我单击另一个按钮并转到第二个视图,当我单击返回到默认视图时,下拉菜单停止工作。 我在 Chrome 中检查过它,没有任何反应 这是下拉菜单的代码:
<div ng-if="filter.entity === 'user'" class="col-md-12 filter-group">
<h5 class="open">Age<span class="caret"></span></h5>
<div class="filter-group-items filter">
<div>Age
<rzslider rz-slider-model="filter.ageMin" rz-slider high="filter.ageMax" rz-slider-options="sliderOptionsAmount">
</rzslider>
</div>
<div>
</div>
这是 js
$(".open").click(() => {
$(".filter").slideToggle()
})
问题与 AJAX 加载内容上的绑定事件相同,参见 How to bind Events on Ajax loaded Content?
jQuery 动态内容的事件绑定应如下所示:
$(document).on("click", ".open", () => {
$(".filter").slideToggle();
});
我认为可能是 JQuery 正在更新 DOM 而 angular 不知道。我会尝试在 angular 中完成所有操作,它会起作用