如何使用 Angular 在 Electron 的新窗口中打开 component.html？答案

【问题标题】：How to open a component.html in a new window in Electron with Angular?如何使用 Angular 在 Electron 的新窗口中打开 component.html？
【发布时间】：2019-12-15 14:13:03
【问题描述】：

我正在使用 Angular 7 在 Electron 中建立一个简单的项目（使用这个项目 https://github.com/maximegris/angular-electron）。

如何在新窗口中打开 component.html？

我已经这样做了：

    createBrowserWindow() {
    const remote = this.electronService.remote;
    const BrowserWindow = this.electronService.remote.BrowserWindow;
    var win = new BrowserWindow({
     height: 600,
     width: 800
     });



    win.loadURL(this.electronService.url.format({
      pathname: this.electronService.path.join(__dirname, './index.html'),
      protocol: 'file:',
      slashes: true,
      hash: '/inicio'
    }) 
    ); 

    win.webContents.openDevTools()

    win.on('closed', () => {
      win = null
    });
  }

但是当我调用该方法时，出现错误：

zone.js:703 未处理的承诺拒绝：ERR_FILE_NOT_FOUND (-6) loading 'file:///C:/Users/xx/Documents/projectName/node_modules/electron/dist/resources/electron.asar/renderer/index .html#/inicio' ;

然后会打开一个新窗口并显示此消息：

不允许加载本地资源：file:///C:/Users/xx/Documents/projecName/node_modules/electron/dist/resources/electron.asar/renderer/index.html#/inicio

【问题讨论】：

可以将代码上传到您的项目中的新分支中，我们下载并尝试错误吗？这很简单（我认为），因为我在一个具有此功能的项目中
对不起，我不能上传项目，因为它受大学限制：/

标签： angular electron

【解决方案1】：

尝试这样使用：

import { app, BrowserWindow } from "electron";
import * as path from "path";
import * as url from "url";
let win: BrowserWindow;
app.on("ready", createWindow);
app.on("activate", () => {
if (win === null) {
 createWindow();
}
});
function createWindow() {
 win = new BrowserWindow({ width: 800, height: 600 });
 win.loadURL(
url.format({
  pathname: path.join(__dirname, `/../../dist/angular-electron/index.html`),
  protocol: "file:",
  slashes: true
})
);
win.webContents.openDevTools();
win.on("closed", () => {
win = null;
});
}

我希望这能解决你的问题....快乐编码。谢谢

【讨论】：