SAP / ui5-webcomponents-ngx

UI5 Web Components for Angular provides directives for each UI5 Web Component. The directives allow to easily build your Angular application following the SAP Design System.
https://ui5-webcomponents-ngx.netlify.app/
Apache License 2.0
23 stars 4 forks source link

Issues with the boolean properties #128

Closed InnaAtanasova closed 2 weeks ago

InnaAtanasova commented 2 weeks ago

Example: <ui5-tab text="Tab 8" selected></ui5-tab> - selected is not working <ui5-tab text="Tab 8" [selected]="true"></ui5-tab> should be set to "true" to work

ilhan007 commented 2 weeks ago

Hi Inna, yes I noticed it as well, this is common for all boolean properties as they are generated as regular inputs at the moment: @Input disabled = false

While in Angular >=16, we can use booleanAttribute transformers to enable attributes working with the attr syntax: @Input({ transform: booleanAttribute })

So, there is clear solution and it is to use the { transform: booleanAttribute }.

The good things is that even now the syntax that you highlighted is good enough and I already updated all storybook stories in the PR to make use of ti, so that the samples are working properly.

But it's good to keep this issue open as this for sure can and needs to be enhanced.