How to use the roosterjs-editor-api.insertImage function in roosterjs-editor-api

To help you get started, we’ve selected a few roosterjs-editor-api examples, based on popular ways it is used in public projects.

github microsoft / roosterjs-react / packages / roosterjs-react-command-bar / lib / components / RoosterCommandBar.tsx View on Github external
private _fileInputOnChange = (): void => {
        const { roosterCommandBarPlugin, imageManager } = this.props;

        const editor: Editor = roosterCommandBarPlugin.getEditor();
        const file = this._fileInput.files[0];
        if (editor && !editor.isDisposed() && file) {
            if (imageManager) {
                const placeholder = imageManager.upload(editor, file);
                editor.insertNode(placeholder);
                editor.triggerContentChangedEvent(ChangeSource.Format);
                editor.addUndoSnapshot();
            } else {
                insertImage(editor, file);
            }
            this._fileInput.value = "";
        }
    };
github microsoft / roosterjs / sample / scripts / initFormatBar.ts View on Github external
document.getElementById('selectFile').addEventListener('change', function() {
        let input = document.getElementById('selectFile') as HTMLInputElement;
        let file = input.files[0];
        if (file) {
            insertImage(getCurrentEditor(), file);
            input.value = '';
        }
    });
github microsoft / roosterjs / publish / samplesite / scripts / controls / ribbon / ribbonButtons.ts View on Github external
fileInput.addEventListener('change', () => {
                let file = fileInput.files[0];
                if (file) {
                    insertImage(editor, file);
                }
            });
            document.body.appendChild(fileInput);