Pipeline Pipeline - 7 months ago 9
Javascript Question

AngularJS - Change text continuously from a array of strings

Is there a way to simulate a carousel of text in my angular controller?

Such as:

//html
<span> {{ notes }}</span>

//angular controller

var i = 0;
var array = ["A", "B", "C", "D", "E"];

while (true) {
$scope.notes = array[i];
i = i + 1;
if (i = array.length - 1) {
i = 0;
}
}


Is there a way to do this without a infinite loop? I am trying to create a carousel of text vertically and having fade animations in a CSS class to try and accomplish this.

Answer

I believe you are looking for $interval.

var i = 0;
var array = ['A', 'B', 'C', 'D', 'E'];

$interval(function () {
  $scope.notes = array[i++ % array.length];
}, 1000);

See example here: https://jsfiddle.net/8pLwjybf/3/