Cómo acceder a la propiedad del objeto con caracteres no válidos

Estoy escribiendo una aplicación angular que interactúa con una API de Google Analytics que ya está en uso. Los datos devueltos por Google tienen el prefijo “ga:” como en el ejemplo “ga: newVisits”.

Si utilizo la expresión {{total.ga:newVisits}}, Angular no puede analizarlo. Cualquier bash de escapar del colon para continuar ha resultado en un error o ha escapado completamente de mi expresión.

¿Cómo puedo pasar {{total.ga:newVisits}} a Angular para que la expresión funcione correctamente?

       
  • {{total.ga:newVisits}}

En JavaScript, se puede acceder a las propiedades de los objetos mediante notación de puntos o notación de corchetes. La notación de puntos es a menudo más limpia, pero tiene restricciones. Como habrás notado, tu propiedad contiene un carácter no válido y, por lo tanto, no se puede acceder a través de la notación de puntos. La solución, entonces, es acceder a la propiedad utilizando una notación de corchetes como esta: total['ga:newVisits'] para que su código completo sea {{total['ga:newVisits']}} . Demostración en vivo aquí (click).

Otra buena característica sobre la notación de corchetes es que le permite usar un nombre de variable como una propiedad:

 var myObj { bar: '123' }; var foo = 'bar'; console.log(myObj[foo]); //logs '123' 

Debe acceder a ella como si fuera una matriz asociativa:

 {{total['ga:newVisits']}}