WEBIX 报告管理器与 Angular 9.1.9 集成

Question

目前我遇到了麻烦。我需要将 Angular 与 Widget Report Manager 集成。但我得到了未知的视图：报告错误。

我按照以下步骤操作：

我使用 npm i @xbs/webix-pro 和 npm i @xbs/reports 安装了 webix-pro 和报告。 我将 js 和 css 包添加到 angular.json 中。这将是：

"styles": [
          "node_modules/@xbs/reports/codebase/reports.css",
          "node_modules/@xbs/webix-pro/webix.css"
        ],
"scripts": [
          "node_modules/@xbs/reports/codebase/reports.js",
          "node_modules/@xbs/webix-pro/webix.js"
        ],

我在我的组件reporter.component.ts中有这样的：

import { Component, ElementRef, OnInit, OnDestroy } from '@angular/core';

import * as webix from "@xbs/webix-pro";

@Component({
  selector: 'reports',
  templateUrl: './reporter.component.html'
})
export class ReporterComponent implements OnInit, OnDestroy {

  private ui : webix.ui.reports

  constructor(root: ElementRef) {

    this.ui = <webix.ui.reports> webix.ui({
      container: root.nativeElement,
      view: 'reports',
      url: "https://docs.webix.com/reports-backend/" //Here my backend
    })
  }

  ngOnInit(): void {
    this.ui.resize();
  }

  ngOnDestroy(): void {
    this.ui.destructor();
  }

}

这是将webix外部小部件与Angular集成的正确方法还是有其他方法？

Answer 1

我已经解决了。我删除：

import * as webix from "@xbs/webix-pro";

并添加了

declare const webix: any

webix-pro 和 reports .js 和 .css 已添加到 angular.json

另外，我可以声明 reports 变量以用于自定义报表管理器。