Saltar al contenido

Inicio angular ng para índice desde 1

Solución:

 *ngFor="let item of items | slice:1; let i = index;

SlicePipe

Hay 2 posibles respuestas a la pregunta, dependiendo de lo que realmente se esté preguntando.

Si la intención es omitir el primer elemento de la matriz, entonces las respuestas que involucran rodaja están en la dirección correcta.

Sin embargo, si la intención es simplemente cambiar el índice mientras sigue iterando sobre todos de la matriz, entonces slice NO es el enfoque correcto, ya que omitirá el elemento 0 en la matriz, por lo que solo generará n-1 elementos de una variedad de longitudes n.

@Taylor dio un ejemplo del mundo real de cuándo es posible que sea necesario cambiar el índice para fines de visualización, como cuando se genera una lista en la que la primera entrada debe leer 1, no 0.

Aquí hay otro ejemplo similar:

<li *ngFor="let book of books; let i = index">
    {{ i + 1 }}.  {{ book.title }}
</li>

que produciría una salida como:

  1. Título del libro de muestra

  2. Otro título de libro

Eso no es posible, pero podrías usar Array.prototype.slice() para omitir el primer elemento:

<li *ngFor="let item of list.slice(1)">{{ item }}</li>

SlicePipe también es una opción si prefiere esa sintaxis:

<li *ngFor="let item of items | slice:1">{{ item }}</li>

Descripción

Todo el comportamiento se basa en el comportamiento esperado de la API de JavaScript. Array.prototype.slice() y String.prototype.slice().

Cuando se opera en un Array, El retorno Array es siempre una copia incluso cuando se devuelven todos los elementos.

Si también necesita que el índice coincida, simplemente agregue la cantidad de elementos que omitió:

<li *ngFor="let item of list.slice(1); let i = index">{{ i + 1 }} {{ item }}</li>

O:

<li *ngFor="let item of items | slice:1; let i = index">{{ i + 1 }} {{ item }}</li>

De todos modos, si necesita poner demasiada lógica en la plantilla para que esto funcione para su caso de uso, entonces probablemente debería mover esa lógica al controlador y simplemente construir otra matriz con los elementos y datos exactos que necesita o almacenar en caché el fragmento array para evitar crear uno nuevo si los datos no han cambiado.

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)


Tags : /

Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *