角电子 WebView 未加载网站的所有功能答案

【问题标题】：angular-electron WebView not loading all functionalities of website角电子 WebView 未加载网站的所有功能
【发布时间】：2020-02-06 11:49:57
【问题描述】：

我正在尝试在我的桌面应用程序（由 Election 和 Angular 构建）中使用 WebView。当我加载窗口时，我能够呈现 WebView，但在登录到网站的 WebView 内容后，所有其他剩余功能都无法正常工作。

注意：网站是使用百里香开发的。

我尝试如下：

<webview id="mainwebview" nodeintegration='on' src="https://tarc-uat.gfcp.io/"
  style=" width:100%; height:calc(100vh - 11vw)"  partition="persist:sitesession" disablewebsecurity="on" webpreferences="allowRunningInsecureContent" >
  <div class="indicator"> </div>
</webview>

和脚本：

onload = () => {
    const webv = document.getElementById('mainwebview')
    window.addEventListener('load', () => {
      webv.addEventListener('dom-ready', () => {
      });
    })
  }

【问题讨论】：

标签： javascript angular webview electron

【解决方案1】：

经过所有可爱的斗争，我找到了解决方案，这对我来说很好，并且所有功能在网站上都可以正常工作。下面是解决办法

<webview id="mainwebview" attr.src="{{url}}" style=" width:100%; height:calc(100vh - 11vw)"> </webview>

然后从下面的角度组件加载您的网址

  export class WebviewComponent implements OnInit {
  public url = 'https://tarc-uat.gfcp.io/';
  constructor() { }
  ngOnInit() {

  }
}

注意：在此之前，您需要在 angular app.module 中导入“NO_ERRORS_SCHEMA”以支持 webview 元素并在 @NgModule 架构中导入，如下所示

import { NgModule, ErrorHandler,NO_ERRORS_SCHEMA } from '@angular/core';

 schemas: [
      CUSTOM_ELEMENTS_SCHEMA,
      NO_ERRORS_SCHEMA
    ]

就是这样，如果您遵循此操作，则不需要 onload 脚本。

【讨论】：