Two-way binding in Blazor

برای اینکه بتوان دیتا را به UI و مجدداً از UI به کد منتقل کرد از two-way binding استفاده می‌کنیم. مثال زیر گویای این مورد است:

<div>
    <p>Name: @Room.RoomName</p>
    <p>Price: @Room.Price</p>
    <p>Active: @Room.IsActive</p>
</div>
<hr />

Room name is: <input type="text" @bind-value="Room.RoomName" @bind-value:event="oninput" />

@code   {
    Models.Room_ViewModel Room = new Models.Room_ViewModel()
    {
        Id = 1,
        IsActive = true,
        Price = 10000,
        RoomName = "Room 1"
    };
}

در این حالت با تغییر دیتا در تکست باکس، دیتای شیء Room نیز تغییر می‌کند. در این حالت @bind-value نقش کلیدی در ایجاد two-way binding را ایفا می‌کند.
در انتها کدی به این شکل وجود دارد (@bind-value:event="oninput") که باعث می‌شود بلافاصله با تغییر نام در تکست‌باکس محتوای متغیر ما نیز تغییر کند.
برای یافتن انواع مختلف event-bindingها از این لینک استفاده کنید.