有沒有辦法在 Angular/Electron 應用程序中創建無模式對話框？

Question

有沒有辦法在 Angular/Electron 應用程序中創建無模式對話框？

我正在查看下面的示例，它們都是模態的：

https://material.angular.io/components/dialog/overview

我需要能夠同時打開多個窗口並移動它們。 但我找不到任何樣本。

謝謝。

---

編輯 1：

我嘗試了以下操作，但它以某種方式將我引導到默認頁面 index.html：

window.open('/app/shared/settings/user-preferences.html'); 

---

編輯2：

我也試過以下，但它沒有編譯。

const { BrowserWindow } = require('electron'); //does not compile!!?
let win = new BrowserWindow({ width: 800, height: 600 });
win.on('closed', () => {
  win = null;
});

win.loadURL(`file://${__dirname}/app/shared/settings/user-preferences.html`);

但這不會編譯並給我錯誤消息：

ERROR in ./node_modules/electron/index.js
Module not found: Error: Can't resolve 'fs' in 'C:\projects\...\MyApp\node_modules\electron'
ERROR in ./node_modules/electron/index.js
Module not found: Error: Can't resolve 'path' in 'C:\projects\...\MyApp\node_modules\electron'

Answer 1

您可以使用window.open() API 通過提供這樣的 URL 並在其中使用對話框上下文來打開窗口的新窗口實例：

window.open('https://www.angular.io', 'nameOfWindow');

這是一個工作示例

編輯1：

考慮到電子 API設置，您還需要執行以下操作：

如果要使用 Chrome 的內置 window.open() 實現，請在 webPreferences 選項對象中將 nativeWindowOpen 設置為 true。

編輯2：

考慮到本地文件，您可以這樣做：

window.open(`file://${__dirname}/app/shared/settings/user-preferences.html`, 'nameOfWindow')