Cascading Dropdownlist issue when placed inside Tab component

[Aruna]

Hi,

I'm trying to create Cascading Dropdownlist as in below code sample. But when i place dropdown list component with a Tab component, cascading functions does not work.

Seeking help to resolve this issue. 

Sample code:

https://stackblitz.com/edit/github-ax5wq9?file=src%2Fapp.component.ts

Thanks,

Aruna.

[Kokila Poovendran]

Hi Aruna,

Thank you for bringing this issue to our attention.

We understand that you're encountering difficulties with the cascading dropdownlist not working properly when placed inside a Tab component. We apologize for any inconvenience this may have caused.

After reviewing your code and analyzing the issue, we've identified that the problem lies in the heightAdjustMode property being set as Auto in the Tab component. This setting causes the content template to compile twice, which may result in the dropdown change event reference changing and causing the cascading dropdown issue.

To resolve this issue, we recommend removing the heightAdjustMode property in the Tab component. This adjustment should allow the cascading dropdownlist to function correctly within the Tab component.

We've provided a modified sample for your reference: https://stackblitz.com/edit/github-ax5wq9-egrvqt?file=src%2Fcascading.html,src%2Fapp.component.ts

Video illustration:

If you encounter any further issues or require additional assistance, please don't hesitate to reach out.

Thank you for your patience and cooperation.