我确定这只是因为我使用它错了,但我很困惑。这一切都始于我确信将我正在构建的Angular站点移动到使用路由器时。结果,我的很多jQuery代码都停止了工作。
例如,我在幻灯片下方有一个导航线,每个幻灯片都带有封端箭头和点。单击箭头时,它会前进或后退。您也可以点击一个点并获得该幻灯片。这是我的代码:
$('#arrow-next').click(function() {
var currentSlide = $('.active-slide');
var nextSlide = currentSlide.next();
var currentDot = $('.active-dot');
var nextDot = currentDot.next();
if(nextSlide.length === 0) {
nextSlide = $('.slide').first();
nextDot = $('.dot').first();
}
currentSlide.removeClass('active-slide').fadeOut(600, function(){
nextSlide.fadeIn(600).addClass('active-slide');
});
currentDot.removeClass('active-dot');
nextDot.addClass('active-dot');
});
// END Clicking NEXT arrow
$('.arrow-prev').click(function() {
var currentSlide = $('.active-slide');
var prevSlide = currentSlide.prev();
var currentDot = $('.active-dot');
var prevDot = currentDot.prev();
if(prevSlide.length === 0) {
prevSlide = $('.slide').last();
prevDot = $('.dot').last();
}
currentSlide.removeClass('active-slide').fadeOut(600, function(){
prevSlide.fadeIn(600).addClass('active-slide');
});
currentDot.removeClass('active-dot');
prevDot.addClass('active-dot');
}); // end click
$('.dot').click(function() {
var index = $('.dot').index($(this));
var currentSlide = $('.active-slide');
var newSlide = $('.slide').eq(index);
var currentDot = $('.active-dot');
var newDot = $(this);
currentSlide.removeClass('active-slide').fadeOut(600, function(){
newSlide.fadeIn(600).addClass('active-slide');
});
currentDot.removeClass('active-dot');
newDot.addClass('active-dot');
}); // end click
我想将这些变成我可以在ng-clck上调用的函数,但我无法弄清楚如何。
答案 0 :(得分:1)
无论您使用的是哪个类点,都要在该html标记中添加ng-click。那应该可以解决问题。 将单击函数转换为范围函数,并将其作为参数发送到ng-click。 但建议不要在控制器中进行DOM操作。如果您以后必须编写单元测试用例,则会遇到问题。所有DOM操作都应该在你的指令中执行。