Binding formControl to Tab-Item not behaving as expected

[nfellinger]

Which generators are affected?

• All
• HTML
• React
• Angular
• Vue
• Web components
• Power Apps

Reproduction case

The underlying input of the db-tab-item component are of type "radio".
By that someone would assume that the whole Tabs component would behave like a radio button list.

Currently when binding a formControl to db-tab-item the raised value of the control is always just true.
This makes it impossible to differentiate from a single formControl which tab has been selected. Its also not possible to programmatically select a tab with this setup.

<db-tab-list>
            <db-tab-item name="tab-1" [formControl]="tabControl">
              Tab 1
            </db-tab-item>
            <db-tab-item name="tab-2" [formControl]="tabControl">
              Tab 2
            </db-tab-item>
</db-tab-list>

A workaround for this is to use seperate formcontrols for each tab.

<db-tab-list>
            <db-tab-item name="tab-1" [formControl]="tab1Control">
              Tab 1
            </db-tab-item>
            <db-tab-item name="tab-2" [formControl]="tab2Control">
              Tab 2
            </db-tab-item>
</db-tab-list>

Problem with this setup is that both formControls still only receive true as value changes.
This means that when the Tabs component gets reinitialized (for example when hiding the component with @if), it cannot correctly retain its state from the formControls since both have the value true.

Expected Behaviour

If the intention of the db-tab-item is to behave like a radio button, the value attribute should be set and the corresponding value raised on value-change event instead of true.

My suggestion would be that the value attribute should automatically be prefilled, but still overridable by the (dev)user.

Screenshots

No response

Browser version

None

Add any other context about the problem here.

As already stated, i'm not sure if the intention of the db-tab-item is to behave like a radio-button or if you even intended for someone to use a formControl on this component.
But i think if you explicetly use input of type "radio" it should also behave like a normal radio button.

Which DB business unit do you work for?

DB Systel GmbH (please name your customer below)

”DB Systel” please enter your customer / ”other” please enter your area or business unit.

DB InfraGO AG

What project are you working on?

EBuLa Rückfallebene (IRE)