Tengo una variedad de artículos. a = ['manzana', 'mango', 'uva', 'papaya', 'plátano', 'pepino']. Hay un elemento de entrada con un marcador de posición como selección de frutas (después de las frutas, debe mostrar los elementos de la matriz al azar o en un ciclo infinito de veces y la fruta del marcador de posición debe cambiar cada dos segundos).

p.ej. seleccionar de frutas manzana nuevamente después de 2 segundos, debería mostrarse seleccionar de frutas mango nuevamente después de 2 segundos seleccionar de frutas uva. entonces quiero implementar un marcador de posición que cambie cada dos segundos un número infinito de veces. Este elemento de entrada se encuentra en el componente de encabezado de la página de inicio. Nota: Esto debería estar en angular 8+.

Intenté usar setInterval en ngafterviewinit Llamé así

 TIME_INTERVAL = 2000;

ngAFterViewInIt(){ this.timerId = window.setInterval(() => this.changePlaceholder, this.TIME_INTERVAL);}

 RANDOM_NUMBER: number = 8; changePlaceholder(count: number = 0) { let randomNumber = Math.floor(Math.random() * this.RANDOM_NUMBER); count = (count + randomNumber) % this.globalSearchItems.length; this.globalSearch.nativeElement.placeholder = this.searchType + ' ' + this.globalSearchItems[count]; } ngOnDestroy(){ if(!!this.timedId){ clearInterval(this.timerId); }}

searchType = 'seleccionar de frutas'

Ahora quiero agregar mi elemento frente a las frutas y cambiarlo cada 2 segundos al azar o en un bucle, no importa.

etiqueta

 <input placeholder = {{searchType}}/>

El pb con este código es cuando inicio sesión por primera vez en la aplicación, el marcador de posición no cambia, pero si hago clic en cualquier otro componente y luego vuelvo al componente de inicio, esto está funcionando. en resumen, cuando inicio sesión por primera vez/nuevamente, setInterval no está llamando a la función de devolución de llamada changePLaceholder

la funcionalidad debería ser así https://dribbble.com/shots/9530283-Daily-UI-022-Search