У меня есть ползунок (с использованием углового материала), который связан с переменной Controller As (avm.itemsIndex), которая используется в ng-классе в списке ng-repeat.
Поэтому каждый элемент в ng-repeat имеет:
ng-class="{
active : avm.itemsIndex == $index,
selected : avm.selecting==item.name,
left : avm.itemsIndex == $index+1 ,
left2 : avm.itemsIndex == $index+2,
right : avm.itemsIndex == $index-1,
right2 : avm.itemsIndex == $index-2
}"
Таким образом, никакие два элемента никогда не должны иметь. Active, потому что все они сравнивают $ index с avm.itemsIndex. Также ни один элемент не имеет как.active, так и.left,.left 2 и т.д.
Проблема в том, что если я быстро перетаскиваю слайдер, чтобы он быстро обновлял avm.itemsIndex, тогда несколько элементов будут иметь.active, а некоторые могут иметь.active и.left,.left2 и т.д.
Кажется, что не все классы элементов обновляются, когда изменяется avm.itemsIndex.
Кто-нибудь знает, как я могу это решить, или даже отладить его?
В итоге в итоге был установлен небольшой тайм-аут (20 мс) при обновлении класса тегов. Похоже, что проблема с браузером более чем угловатая, и слишком быстро обновляет атрибут тега
Для отладки просто дамп значения с помощью {{ avm.itemsIndex == $index+2 }}
Я использую контроллер как синтаксис. Вы пытались сделать avm.itemsIndex
функцией вместо свойства? У меня была лучшая радость от привязки при использовании функций.
Поэтому вместо:
this.itemsIndex = 5;
Вам придется:
this.itemsIndex = function() {
return 5;
}
и в вашем HTML:
avm.itemsIndex() === $index+1; // notice parantheses