Amelia, parte de este gran equipo de trabajo, nos hizo el favor de escribir este artículo porque conoce perfectamente dicho tema.
Solución:
Esto es lo que he probado y parece funcionar
En mi controlador tengo
$scope.menuStatus = [ isOpen : true ,
isOpen : false ,
isOpen : false ]
en mi html tengo
Cars
Customers
Staff
¿Qué tal trabajar con CSS? Bootstrap agrega una clase collapsed sobre el html elemento que tiene la data-toggle="collapse". Cuando se abre la diapositiva, elimina este collapsed clase. Entonces podemos trabajar con css para, por ejemplo, girar el span elemento (un hijo del elemento que tiene el data-toggle attribute).
Lorem ipsum dolor...
NOTA IMPORTANTE : Garantizar collapsed La clase se agrega al elemento que tiene el data-toggle="collapse" attribute para que esto funcione sin problemas. De lo contrario, en la carga inicial del elemento, el span el elemento no gira como se esperaba la primera vez.
Le recomendaría que consulte ‘UI Bootstrap’ del equipo de AngularUI. Es una colección de “componentes Bootstrap escritos en AngularJS puro”.
http://angular-ui.github.io/bootstrap/
Su sitio web presenta un ejemplo que muestra su directiva Accordion usando ng-class para alternar los iconos de chevron.
http://angular-ui.github.io/bootstrap/#/accordion
Su directiva también incluye una close-others attribute que, si true, se asegurará de que solo un único panel esté abierto a la vez.
Acuérdate de que te concedemos valorar este artículo si te fue útil.