How to get ChildContent to work in Blazor??
Opened this issue · 8 comments
private RenderFragment childContent { get; set; }
private RenderFragment AddContent() => builder =>
{
builder.AddContent(1, textContent);
};
In blazor a customer is trying to do the following: (If there is a solution already available please assist).
I want to change the child of a docking element during the execution.
Example:
IgbContentPane contentPane1 = new IgbContentPane { PaneType = DockManagerPaneType.ContentPane, Size = 600, Header = "Workspace", ContentId = "content1", IsPinned = true, ChildContent = ??????????????????????? };
I need an option to add content on the fly.
For example, I have a list of UI component names on the left side.
The user should be able to drag those to the right and place them on the main panel.
The number of controls in the docking panel is flexible. I cannot know in advance how many slots there will be.
This is the reason I want to set those in the code section.
Would you happen to have a solution for this case?
@mddifilippo89 , in Web Components you can modify the layout object of the Dock Manager and then update like this - Update Layout. I'm not sure how this can be done in Blazor, so maybe @gmurray81 can answer this.
@gmurray81
Updating the layout is not documented in Blazor as suggested in WebComponents.
It would be more usual to make the pabe children conditional in the razor like you would do with Angular.
But if doing it this way. The easiest method it jus to interleave markup when specifying the child content like ChildContent =@(
Something along those lines. The sort of thing you'd do in react. Like I explained when this question came up in scrum.
GitHub mangled that a bit...
ChildContent = @(<div>...</div>)You can also specify a render fragment as a function, you you kind of need to know what you are doing. I'm not sure if MS has some good doc on it
Ah in the above. I think you still want it to be a function that takes the context and returns the markup so that it has the data context. IIRC an arrow function will do. If you Google it, you should see, if not I can find an example somewhere. This isn't anything custom from us. It's standard Blazor stuff.
See the answers to this guy: https://stackoverflow.com/questions/73301295/how-to-render-html-renderfragment-code-in-blazor