WEBIX报表管理器与Angular 9.1.9的集成

Question

当前我遇到了一个问题。我需要将Angular与Widget Report Manager集成。但我得到了未知的视图：报告错误。

我遵循了以下步骤：

我用npm I@xbs/webix pro和npm I@xbs/reports安装了webix pro。我在angular.json中添加了js和css捆绑包

"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"
],

我在我的组件报告中有。组件。这是：

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 中

此外，我可以为自定义报表管理器声明报表变量。