feat(MonacoEditor): Add onDidChangeModelContent event (#378)

Co-authored-by: yanpengju <[email protected]>
masastack · Apr 12, 2023 · 5fd9678 · 5fd9678
1 parent 5b033e5
commit 5fd9678
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 4 deletions.
diff --git a/src/Component/BlazorComponent.Web/package.json b/src/Component/BlazorComponent.Web/package.json
@@ -8,8 +8,8 @@
     "build": "rollup --config rollup.config.ts",
     "dev:echarts": "rollup --config rollup.config.echarts.ts --watch",
     "build:echarts": "rollup --config rollup.config.echarts.ts",
-    "dev:monacoseditor": "rollup --config rollup.config.monaco-editor.ts --watch",
-    "build:monacoseditor": "rollup --config rollup.config.monaco-editor.ts",
+    "dev:monacoeditor": "rollup --config rollup.config.monaco-editor.ts --watch",
+    "build:monacoeditor": "rollup --config rollup.config.monaco-editor.ts",
     "dev:gridstack": "rollup --config rollup.config.gridstack.ts --watch",
     "build:gridstack": "rollup --config rollup.config.gridstack.ts",
     "dev:input": "rollup --config rollup.config.input.ts --watch",

diff --git a/src/Component/BlazorComponent.Web/src/proxies/monaco-editor/index.ts b/src/Component/BlazorComponent.Web/src/proxies/monaco-editor/index.ts
@@ -8,8 +8,13 @@ interface Monaco {
 
 declare const monaco: Monaco;
 
-function init(id: string, options: MonacoEditor.IStandaloneEditorConstructionOptions) {
-  return monaco.editor.create(document.getElementById(id), options);
+function init(id: string, options: MonacoEditor.IStandaloneEditorConstructionOptions, dotNetHelper) {
+  const editor = monaco.editor.create(document.getElementById(id), options);
+  editor.onDidChangeModelContent(()=> {
+    dotNetHelper.invokeMethodAsync("OnChange", editor.getValue());
+  });
+
+  return editor;
 }
 
 function defineTheme(name, value: MonacoEditor.IStandaloneThemeData) {