I would like to share some basic input components between Blazor projects but I seem to be missing something in my shared razor project when it comes to supporting the data binding.
Using the Microsoft component binding example here.
The Component Code looks like this:
Password: <input
value="@Password"
@oninput="OnPasswordChanged"
type="@(showPassword ? "text" : "password")" />
<label><input type="checkbox" @bind="showPassword" />Show password</label>
@code {
private bool showPassword;
[Parameter]
public string Password { get; set; }
[Parameter]
public EventCallback<string> PasswordChanged { get; set; }
private Task OnPasswordChanged(ChangeEventArgs e)
{
Password = e.Value.ToString();
return PasswordChanged.InvokeAsync(Password);
}
}
and then this is used like this:
<PasswordBox @bind-Password="password" />
@code {
string password;
}
When the component is declared directly in my Blazor WebAssembly project this works as expected. However, if I move the component to a library so that I use it in shared components I get a compile error:
Error The attribute names could not be inferred from bind attribute 'bind-Password'. Bind attributes should be of the form 'bind' or 'bind-value' along with their corresponding optional parameters like 'bind-value:event', 'bind:format'
My guess is that I'm missing a reference in my shared project which handles these bind attributes - but I don't know how to find how what I need to reference.
I currently reference:
NETStandard.Library 2.1
Microsoft.AspNetCore.Components (3.1.5)
- Microsoft.AspNetCore.Components.Web (3.1.5)
- System.Net.Http.Json (3.2.1)
This seems enough for normal attribute binding for fields and passing values from one component to another - but not for this specific two-way bind syntax. What am I missing?