Аккордеон не открывается после привязки данных из API в Angular4

Question

Работая в приложении Angular 4, в этом у меня есть аккордеон внутри аккордеона. Теперь я пытаюсь динамически связать аккордеон из ответа API (json).

Здесь, в моем случае, заголовок аккордеона является обязательным, но внутренние параметры не связываются.

Я не могу точно сказать, является ли он обязательным, но не открытым, или он не связывается.

Рабочий пример со статическими значениями:

https://stackblitz.com/edit/angular-9cuvb9?file=app%2Fapp.component.html

Динамическое связывание: (с проблемой)

https://stackblitz.com/edit/angular-bootstrap-carousel-dynamic2-jwb2zj?file=app/app.component.html

Может кто-нибудь помочь мне решить эту проблему.

Answer 1

Я не совсем в курсе точной цели, которую вы пытаетесь достичь, но в динамической версии вы устанавливаете цель данных - href="#collapseInnerTwo", а в id для складываемой вы пытаетесь оценить какое-то выражение - [id]="'collapseInnerTwo' + group?.CAMD_PRGRP_DESC"

Они никогда не будут совпадать и никогда не разрушатся. Если вы измените

[id]="'collapseInnerTwo' + group?.CAMD_PRGRP_DESC"

К

id="collapseInnerTwo"

Работает как положено