Blazor (Server Side) Passing Parameter to View Model

Question

I've been following the excellent BlazorTrain series by Carl Franklin and after watching Episodes 24 and 25 I've attempted adopting the MVVM approach in my current project.

The issue I've hit is on pages which have a parameter as in

@page "/ViewTask/{Id}"

Prior to conversion to MVVM my code on ViewTask was similar to

[Inject] protected NavigationManager NavigationManager { get; set; }
[Inject] protected IMyService MyService{ get; set; }
[Inject] protected IMyService2 MyService2{ get; set; }
[Inject] protected IMyService3 MyService3{ get; set; }

[Parameter] public string Id { get; set; }

In my new ViewModel, I am injecting the services in the constructor as below however the parameter Id is null. Is there a straightforward way to pass parameters to the ViewModel class? I'm thinking of making the the method GetWorkTask() public and accept a parameter of Id and pass the parameter that way but wanted to see if there are better ways?

public class ViewTaskViewModel : IViewTaskViewModel
{
    public ViewTaskViewModel(NavigationManager navigationManager,
        IMyService myService,
        IMyService2 myService2,
        IMyService3 myService3)
    {
        NavigationManager = navigationManager;
        MyService = myService;
        MyService2 = myService;
        MyService3 = myService3

        InitializeViewModel().GetAwaiter().GetResult();
    }
    
    [Parameter] public string Id { get; set; }

    private NavigationManager NavigationManager { get; set; }
    private IMyService MyService { get; set; }
    private IMyService2 MyService2 { get; set; }
    private IMyService3 MyService3 { get; set; }
    
    protected async Task InitializeViewModel()
    {
        ...
        GetWorkTask()
    }
    
    private void GetWorkTask()
    {
        int taskId = int.Parse(Id);
        ...
    }
}

Carl Franklin · Accepted Answer · 2020-11-06 23:58:28Z

2

That seems like a sensible approach. We sometimes create an InitializeViewModel() method that takes whatever startup parameters you pass it. You can also make Id a regular property on the ViewModel, and then do something like this:

@code
{
    private string id = "";
    [Parameter]
    public string Id
    {
        get { return id; }
        set { IndexViewModel.Id = value; }
    }
}

answered Nov 6, 2020 at 23:58

Carl Franklin

361 bronze badge

Sign up to request clarification or add additional context in comments.

1 Comment

DotNetDublin Over a year ago

Thanks Carl. Really appreciate the response. As I created further ViewModels I started using a PassParameters method which would be the same as your InitializeViewModel. Reassuring to hear I’m not way off track and I’ll keep in mind the alternative option you mention.

DotNetDublin · Accepted Answer · 2020-11-06 13:43:40Z

0

Currently, I have it working using the below approach

Adding the below to the bottom of ViewTask.razor and as mentioned changing private void GetWorkTask() to public void GetWorkTask(int id) within ViewTaskViewModel and removing the call to it from within InitializeViewModel().

@code
{
    [Parameter] public string Id { get; set; }

    protected override void OnInitialized()
    {        
        ViewModel.GetWorkTask(int.Parse(Id));
    }
}

answered Nov 6, 2020 at 13:43

DotNetDublin

7932 gold badges10 silver badges25 bronze badges

Collectives™ on Stack Overflow

Blazor (Server Side) Passing Parameter to View Model

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related