I am trying to use a bootstrap collapsable panel into an angular component.
From what i've seen the bootstrap approach is to use the id of the panel in order to collapse. This works as stand alone, however, when used into an angular component, the same id creates an undesired effect when toggle-ing between collapse and not collapse mode. ( always the first panel is collapsed/uncollapsed)
My next step was to create my custom collapse panel. This works and can be
seen here plunker , but the collapse effect is not the same ( the plunker link displays in parallel my panel and the bootstrap panel).
My question is how can i use the bootstrap panel into my component or how can i change the css to have the same bootstrap effect on collapse/un-collapse. ?
<custom-filter-accordion button-text="Expand / Collapse Non-BootStrap"></custom-filter-accordion>