Проблема с Accordion plugin Bootstrap

у меня есть страница, которую я делаю с Bootstrap и AngularJS для front-end и я произвожу несколько accordions на той же странице динамического способа с одним ng-repeat. Проблема состоит в том, что, когда я кликаю на именах tabs, чтобы расширять их, прячут титул tab и являются контентом... а именно, оно не функционирует, как он был бы должен, и у меня есть другой код, который равен, и если оно функционирует..., я не понимаю, потому что это поведение. Оставил html, который я использую и фильтр AngularJS (Угловой 1), который я использую из-за сомнений...

productos.html:

    
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        

        
        
        
    
    
        

        
        

            

                

                    
{{r.rubro | uppercase}}
                    

                        

                            
{{t.tipo | uppercase}}
                            
                            

                                
{{prod.nombre}}
                            
                            
                            

                                

                                    
{{prod.resenia}}
                                    
INTEGRANTES:
                                    
                                    

                                        

                                            

                                                

                                                   {{integrante.nombre}} {{integrante.apellido}}
                                                
                                            
                                            

                                                

                                                    
{{integrante.resenia}}
                                                
                                            
                                        
                                    
 
                                
                            
                        
                    
                
            
        

        

        
        
        
        
        
        
    

ProductosController.js:

(function(){

    var module = angular.module("tangoInfinito");

    var ProductosController = function($scope, ProductosService) {

        function idAsignado(lista, producto) {
            var listaLength = lista.length;
            for (var i = 0; i < listaLength; i++) {
                if (lista[i].producto === producto) {
                    return true;
                }
            }
            return false;
        };

        var listaIdAccordions = [];
        var accordionNumber = 1;
        $scope.accordionId = function(prodNombre) {
            if(!idAsignado(listaIdAccordions, prodNombre)) {
                var accId = "accordion" + accordionNumber;
                accordionNumber++;
                listaIdAccordions.push({
                    producto: prodNombre,
                    id: accId
                });
                //console.log(listaIdAccordions);
                //console.log("Nuevo id asignado");
                return accId;
            }
            else {
                var largo = listaIdAccordions.length;
                for(var i = 0; i < largo; i++) {
                    if(listaIdAccordions[i].producto === prodNombre) {
                        //console.log(listaIdAccordions);
                        //console.log("Id devuelto");
                        return listaIdAccordions[i].id;
                    }
                }
            }
        };

        var armarLista = function($rubros, $tipos) {
            var lista = [];
            var rubrosTemp = $rubros.slice(0);
            var tiposTemp = $tipos.slice(0);

            for(var i = 0; i < rubrosTemp.length; i++) {

                var rubro = rubrosTemp[i].rubro.toUpperCase();

                lista.push( {descripcion: rubro, isHeader: true} ); 
                for(var j = 0; j < tiposTemp.length; j++) {
                    if(tiposTemp[j].rubro === rubrosTemp[i].rubro) {
                        lista.push( {descripcion: tiposTemp[j].tipo, isHeader: false} );
                    }
                }
            }

            return lista;
        };

        var getDatosFromService = function() {
            ProductosService.getDatos().success(function(response) {

                //Lista para armar el menu desplegable (menu productos) de la barra de navegación
                //Esta lista es tomada por index.html y productos.html 
                //(en un script al final de la página) para armar el menu dinamicamente
                $scope.navbarList = armarLista(response["rubros"], response["tipos"]);
                $scope.productos = response["productos"];
                $scope.rubros = response["rubros"];
                $scope.tipos = response["tipos"];
            });
        }

        getDatosFromService();
    };

    module.controller("ProductosController", ProductosController);

})();

IdFilter.js:

(function() {

    var module = angular.module("tangoInfinito");

    var IdFilter = function() {
        return function(item) {
            var id = "";
            id = item.toLowerCase();
            id = id.replace(/\s/g, "-");
            return id;
        };
    };

    module.filter("IdFilter", IdFilter);

})();

И поведение, о котором я говорю им:

Я ИЗДАЮ: я видел, что по какому-то разуму, когда я кликаю на каком-то титуле, в div, у которого есть класс panel-heading добавляют класс collapse, но нет in, из-за которого свойство display перейди к тому, чтобы быть none, и также он присоединяется один style="height: 20px;", который я принимаю, должен будет быть через JavaScript, так как сначала у элемента этого нет. Но я не могу приходить к заключению, откуда приходят эти изменения...