DropDown shows incorrect labels when deleted

I'm having an issue with Dropdown component not updating/re-rendering chips/labels with the correct values.

I have a list of objects where one of the properties is a list of string. Each object renders a RadzenDropDown component in a for loop. The value of the drop down binds to the list of string property.

public class Product{
  public string Name {get;set;}
  public List<string> Sizes {get;set;}
}

foreach(var product in _products)
{
<RadzenDropDown @bind-Value=@product.Sizes Data=@sizesPossible Multiple=@true Chips=@true AllowFiltering=@true ..../>
<RadzenButton Click=@(args => RemoveProduct(product) />
}

void RemoveProduct(Product p)
{
   _products.Remove(p);
}

image

If I delete the second item of the list (i.e. the second product), it results in the following, which is incorrect:
image

I expect third and fourth components to shift up and their values should be the same but for some reason, the labels are messed up. If I expand the drop down however, I can see that the values are correct (i.e. correct options are selected)

Any ideas why this is happening?

Try to call StateHasChanged() for this page.

Tried it like so, but issue still exists

Try to change this to expression:
Data=@sizesPossible.Select(i => i)

That works! Thank you. But I wonder why :thinking:

Will force the component to reload the items according to the specified Data.