How can I bind properties to a list in Blazor?

Platform: Blazor| Category: General

To bind properties to a list in Blazor, you can use the @foreach loop and the @bind directive. Here’s an example:

@page "/" 
<h3>List Binding Example</h3> 
<ul> 
    @foreach (var item in itemList) 
    { 
        <li> 
            <input type="text" @bind="@item.Name" /> 
        </li> 
    } 
</ul>   

<button @onclick="AddNewItem">Add Item</button>  

@code { 
    List<ItemModel> itemList = new List<ItemModel>(); 
    void AddNewItem () 
    { 
        itemList.Add(new ItemModel()); 
    }  

    public class ItemModel 
    { 
        public string? Name { get; set; } 
    } 
} 

View Sample in GitHub

Share with

Related FAQs

Couldn't find the FAQs you're looking for?

Please submit your question and answer.