¿Cómo establecer el atributo id de un elemento HTML dinámicamente con angularjs (1.x)?

Proporcionó un elemento HTML de tipo div , cómo establecer el valor de su atributo id , que es la concatenación de una variable de ámbito y una cadena?

ngAttr directiva ngAttr puede ser de gran ayuda aquí, tal como se presentó en la documentación oficial.

https://docs.angularjs.org/guide/interpolation#-ngattr-for-binding-to-arbitrary-attributes

Por ejemplo, para establecer el valor del atributo id de un elemento div , de modo que contenga un índice, un fragmento de vista podría contener

 

que sería interpolado a

 

Esto me funcionó bastante bien:

Una forma más elegante que encontré para lograr este comportamiento es simplemente:

 

Para mi implementación, quería que cada elemento de entrada en una repetición ng tuviera un ID único para asociar la etiqueta. Entonces, para una matriz de objetos contenidos dentro de myScopeObjects uno podría hacer esto:

 

Ser capaz de generar identificadores únicos sobre la marcha puede ser muy útil cuando se agrega dinámicamente contenido como este.

Simplemente podría hacer lo siguiente

En tu js

 $scope.id = 0; 

En tu plantilla

 

que representará

 

No es necesario concatenar dentro de llaves dobles.

En caso de que haya llegado a esta pregunta, pero relacionado con la nueva versión angular> = 2.0 .

 

Si usas esta syntax:

 

Angular representará algo así como:

  

Sin embargo esta syntax:

 

generará algo como: