How to Increase MaxFileSize Video Uploads in Angualr Rich Text Editor?

To increase the maximum file size for video uploads in the Rich Text Editor, you can utilize the dialogOpen event. This allows you to access the Uploader component instance and modify its maxFileSize property, which has a default value of 30 MB.

Rich Text Editor Implementation

Integrating and Customizing the Rich Text Editor with Event Listeners:

This setup integrates the Rich Text Editor using a specified ID, allowing for easy reference and toolbar customization. It also includes an event listener for the dialogOpen event, enabling modifications to uploader settings when triggered.

<ejs-richtexteditor
    id="insertMediaRTE"
    [toolbarSettings]="tools"
    (dialogOpen)="dialogOpen($event)">
</ejs-richtexteditor>

Toolbar Configuration and DialogOpen Handler for Video Uploads:

This section outlines the configuration of toolbar settings to specify available tools in the Rich Text Editor. It also describes the dialogOpen handler, which adjusts the uploader’s maxFileSize in the video dialog to 50 MB, facilitating larger video file uploads.

// Define toolbar settings
  public tools: ToolbarSettingsModel = {
    items: [
      'Bold', 'Italic', 'Underline', '|',
      'Formats', 'Alignments', 'OrderedList', 'UnorderedList', '|',
      'CreateLink', 'Image', 'Audio', 'Video', '|',
      'SourceCode', 'Undo', 'Redo'
    ]
  };
  
public dialogOpen(args) {
    if (args.container.classList.contains('e-rte-video-dialog')) {
        // Set maxFileSize to 50 MB
        (document.getElementById('insertMediaRTE_upload') as any).ej2_instances[0].maxFileSize = 50000000;
    }
}

Note

• The maxFileSize is specified in bytes. In the example above, it is set to 50 MB (50,000,000 bytes).

Additional References

• Rich Text Editor API Documentation
• Uploader API Documentation