Angular中如何程序化失焦SyncFusion文档编辑器？

针对Angular中SyncFusion DocumentEditor的程序化失焦需求，以下两种可靠方案可以实现：

方案一：直接操作编辑器DOM元素调用blur #

通过编辑器实例获取内部可聚焦的内容区域元素，直接调用原生blur()方法：

// 在组件方法中执行以下代码
const contentArea = this.editorContainer.documentEditor.element.querySelector('.e-content') as HTMLElement;
if (contentArea) {
  contentArea.blur();
}

this.editorContainer.documentEditor.element指向编辑器的根DOM节点，.e-content是SyncFusion DocumentEditor内置的内容编辑区域类名，该元素支持原生聚焦/失焦操作。

方案二：通过临时元素转移焦点 #

创建一个隐藏的临时输入框并聚焦它，强制编辑器失去焦点：

// 在组件方法中执行以下代码
const tempInput = document.createElement('input');
// 隐藏临时元素，避免影响页面布局
tempInput.style.cssText = 'position: absolute; opacity: 0; pointer-events: none;';
document.body.appendChild(tempInput);
tempInput.focus();
document.body.removeChild(tempInput);

这种方法不依赖编辑器内部结构，兼容性更强，适合所有版本的SyncFusion DocumentEditor。

内容的提问来源于stack exchange，提问作者Samir Habota