Handle open/collapse events of Accordion in Angular

Question

If I have this code:

      {{group.content}}

         


        

Answer 1

I used an associative array to create a relationship between the opened state and the model object.

The HTML is:

  



                
                    
                       
                          

                         {{topic.title}}
                         Updated: {{topic.updatedDate}}
                          
                           
                       
                  


                      

                          Add Comment
                      
                     

                         Edit Topic
                     
                      
Topic Description
                      
{{topic.description}}
                      

                          

                              
Comment by: {{comment.author}}Updated: {{comment.updatedDate}} | {{comment.updatedTime}}
                              
{{comment.comment}}
                             

                               Edit 
                               Delete 
                             
                          
                      
                  

                    
                

The controller snippet is:

   self.model = {
      closeOthers : false,
      opened   : new Array(),
      topics   : undefined
   };

The 'topics' are populated on an AJAX call. Separating the 'opened' state from the model objects that are updated from the server means the state is preserved across refreshes.

I also declare the controller with ng-controller="CaseController as controller"