Angular5 анимации: ключевые кадры с шагами

Question

Я пытаюсь анимировать таблицу спрайтов в угловых.До сих пор я делал это с чистым CSS, определяя ключевые кадры:

@keyframes sprite {
  from { background-position: 0% 0 }
  to { background-position: 100% 0 }
}

и изменяя свойство анимации в стиле следующим образом:

sprite 0.8s steps(${this.steps}) ${this.repeat}`

Я обнаружил, чтоесть угловая функция animate, которая должна упростить ее, но я не могу узнать, как указать количество шагов, которые должна использовать моя анимация, или сколько раз она должна повторяться.

  animate("1s", keyframes([
    style({ backgroundPosition: "0% 0"}),
    style({ backgroundPosition: "100% 0"})
  ]));

IsМожно ли сделать это с угловым?и если да - как?