Search code examples
frontendcomponentsblazorrenderblazor-webassembly

Render component dynamically in Blazor using List<string>


I am trying to render component dynamically based on string List.

Let's List values which contains Component Name.

For example:

List<string> componentName = new List<string>() { "SurveyPrompt", "FetchData","Counter" };

Based on above list my component should render.

In Blazor, we have DynamicComponent in which it will generate Dynamic component based on component Type List. Below code is for reference.

Blazor page

<div class="container-fluid">
      <div class="row" >
            <div class="col-md-12">
                <div class="d-flex flex-wrap" style="height: 200px;">

                 @foreach (var component in components)
                {
                    <DynamicComponent [email protected] [email protected] />
                }
            </div>
        </div>
    </div>
</div>

Based on components list it going to render components

@code {
                
                 public List<(Type type, Dictionary<string, object> parameters)> components = new List<(Type type, Dictionary<string, object> parameters)>()
    { (typeof(SurveyPrompt), new Dictionary<string, object>() { }) };
                }

Here, how can I pass component name as string and convert it into Blazor Component?


Solution

  • I have accomplish this by getting all assembly by default and check based on my string List data

     public List<(Type type, Dictionary<string, object> parameters)> components = new List<(Type type, Dictionary<string, object> parameters)>();
    
    
    
     Assembly assembly = Assembly.GetEntryAssembly();
                        Type[] assemblyType = assembly.GetTypes();
        
                        for (int i = 0; i < assignedFeatureList.Count; i++)
                        {
                            Type typeComponent = assemblyType.Where(x => x.Name.Contains(assignedFeatureList[i])).FirstOrDefault();
                            if (typeComponent != null)
                            {
                                (Type type, Dictionary<string, object> parameters) item;
        
                                item.type = typeComponent;
                                item.parameters = new Dictionary<string, object>();
        
                                components.Add(item);
        
                            }
                        }