Синхронизация аудио и анимации в angularjs

Question

Я пытаюсь синхронизировать звук с анимацией в angularjs. Я делал это до использования jQuery, но теперь, когда я перенес свой проект на angularjs, я пытаюсь придерживаться философии angularjs.

В jQuery я добавил атрибут data-time="time" к каждому элементу span, содержащему слово. Я сохранил все тайминги в массиве. Когда была вызвана функция воспроизведения звука (), я использовал таймер для отслеживания прошедшего времени. Через определенные промежутки времени я опрашивал таймер (каждые 10 мс, поскольку все тайминги были округлены до ближайших 10 мс). Если текущее время соответствовало текущему времени в массиве, я использовал селектор, чтобы найти диапазон, атрибут data-time которого содержал текущее время. Этот промежуток будет выделен путем добавления к нему класса "highlight". Схема работала достаточно хорошо.

Однако в angularjs я пытаюсь добиться того же, не используя селекторы. Кто-нибудь знает способ, которым я мог бы сделать это? Мне сказали, что все, что делается с помощью jQuery, может быть сделано в angularjs.

Большое спасибо.

Answer 1

Следите за временем так же, сохраните его в $scope.currentTime и просто используйте ng-класс, например,

<span ng-class="{highlight:currenttime == 910}">word</span>

910 здесь будет то, что вы назначаете на data-time в версии jquery.

если вы повторяете нг слова в угловой версии, это может быть так

<span ng-repeat="word in words" ng-class="{highlight:currenttime == word.time}">{{word.text}}</span>