How to load HTMLContent as Parameter

[mats68]

Hi

How can I load the HTMLContent as a Parameter. This is what I tried: ` BlazoredTextEditor QuillHtml;

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

//protected override async Task OnParametersSetAsync()
//{
//    // QuillHtml is null
//    await this.QuillHtml.LoadHTMLContent(QuillHTMLContent);
//}

//protected override async Task OnAfterRenderAsync(bool firstRender)
//{
//    // Error: Microsoft.JSInterop.JSException: Cannot read property 'root' of undefined
//    await this.QuillHtml.LoadHTMLContent(QuillHTMLContent);
//}

` Repo to reproduce

I would also like to know if i can react to onChange of the editor.

[ADefWebserver]

Please see the following samples to see how to properly load content into the control:

• https://github.com/Blazored/TextEditor/blob/master/samples/BlazorServerSide/Pages/Index.razor

• https://github.com/ADefWebserver/Blazor-Blogs/blob/master/BlazorBlogsLibrary/Pages/BlogAdministration.razor

The underlying QuillJs control has more features, but, you will have to write custom JavaScript. See: https://quilljs.com/docs/api/

[wangjunjx8868]

How to upload local files

[ADefWebserver]

@wangjunjx8868 See: Uploading Images With The Blazor Rich Text Editor

[Webreaper]

Please see the following samples to see how to properly load content into the control:

Neither of those examples shows how to correctly pre-load content into Quill when the page/component first loads. I'm trying to do it in OnAfterRenderAsync but the control is null; it looks like I'll have to do all sorts of malarky to figure out when to apply it, and use a flag to ensure I don't repeatedly apply it.

It would be great if Blazored.TextEditor could wrap that and provide some clean way to initialise the html content.

Edit: I managed to make it work by dropping the initialisation into the OnParametersSetAsync call....

[stieven76]

Please see the following samples to see how to properly load content into the control:

Neither of those examples shows how to correctly pre-load content into Quill when the page/component first loads. I'm trying to do it in OnAfterRenderAsync but the control is null; it looks like I'll have to do all sorts of malarky to figure out when to apply it, and use a flag to ensure I don't repeatedly apply it.

It would be great if Blazored.TextEditor could wrap that and provide some clean way to initialise the html content.

Edit: I managed to make it work by dropping the initialisation into the OnParametersSetAsync call....

Would you like to share what you've just done to make it work? I have the same problem. I need to load html into the editor when the page loads but I get the same errors.

[Webreaper]

I basically do something like this:

<BlazoredTextEditor @ref="QuillHtml" >
   etc
</BlazoredTextEditor>

@code
{
BlazoredTextEditor QuillHtml;

protected async override Task OnParametersSetAsync()
{
    /// Load the content here based on the parameters
   try
   {
      await QuillHtml.LoadHTMLContent( myContent );
      StateHasChanged();
   }
   catch( Exception ex )
   {
      Console.WriteLine( $"Quill Exception: {ex}");
   }
}
}