[英]pagination with angular4 and jquery
I try apply pagination in angular 4 and jquery but I have error when I click in next button it moving for first 2 pages and then moving 3 other pages and then moving 5 other pages( when click).. 我尝试在angular 4和jquery中应用分页,但是单击下一步按钮时出现错误,它先移动前2页,然后再移动3页,然后再移动5页(单击时)。
code component: 代码部分:
addClass(x) {
$(".page-item").click(function () {
$(this).addClass("current").siblings().removeClass('current');
});
}
next() {
$('.next').click(function () {
$('.current').next('li').trigger('click');
});
}
code html: 代码html:
<ul>
<li class="previous">Previous</li>
<li class="next" (click)="next()">Next</li>
</ul>
<ul class="pagination">
<li *ngFor="let x of pages" class='page-item current'
(click)='addClass(x)'>{{x}}</li>
</ul>
class current is add in when I click in page 5 for example but error class current it moving 2 pages for first click and next click moving 3 other pages and next click moving 5 pages 例如,当我单击第5页时添加当前类,但当前错误类将其移动,第一单击将移动2页,然后单击将其移动其他3页,然后单击将移动5页
You are already binding the click
event in your HTML template: 您已经在HTML模板中绑定了click
事件:
<li class="next" (click)="next()">Next</li>
And in your component you're adding a new click
handler on every click: 并且在您的组件中,每次点击都会添加一个新的click
处理程序:
next()
{
$('.next').click(function(){
$('.current').next('li').trigger('click');
});
}
So what you actually want to do is just relay that click in the method instead of adding a new handler: 因此,您实际要做的只是中继单击方法,而不是添加新的处理程序:
next()
{
$('.current').next('li').trigger('click');
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.