在 Angular 8 中集成 jQuery 控件答案

【问题标题】：Integrate jQuery control in angular 8在 Angular 8 中集成 jQuery 控件
【发布时间】：2020-03-13 10:05:31
【问题描述】：

我们正在尝试将 jQuery 版本的控件集成到 Angular 8 应用程序中。我尝试在ngAfterViewInit() 中初始化组件，但出现错误。

ngAfterViewInit() {
  jq("#PivotGrid").ejPivotGrid({
    dataSource: {
      data: this.data,
      rows: [{
        name: 'departmentName',
        caption: 'Department',
        showSubTotals: false
      }, {
        name: 'className',
        caption: 'Class',
        showSubTotals: false
      }, {
        name: 'metricName',
        caption: 'Metric'
      }],
      columns: [{
        name: 'year',
        caption: 'Year'
      }, {
        name: 'quarterDescription',
        caption: 'Quarter'
      }, {
        name: 'monthDescription',
        caption: 'Month'
      }, {
        name: 'weekDescription',
        caption: 'Week'
      }, {
        name: 'channel',
        caption: 'Channel'
      }, ],
      values: [{
        name: 'metricValue',
        caption: 'Metric Value'
      }, ]
    }
  });
}

错误是

TypeError: jquery__WEBPACK_IMPORTED_MODULE_2__(...).ejPivotGrid 不是函数

angular.json 中的脚本部分

     "scripts": [
          "./node_modules/jquery/dist/jquery.min.js",
          "src/assets/scripts/ej.js"
        ]

【问题讨论】：

错误是...？此外，删除数组中的尾随逗号。它们会导致 IE 出现问题
嗨@RoryMcCrossan 我得到的错误是 TypeError: jquery__WEBPACK_IMPORTED_MODULE_2__(...).ejPivotGrid 不是一个函数，但我包含了库，尝试在 index.html 中包含为 cdn 并尝试下载脚本和包含在 angular.json 中。两者都不起作用。
问题可能出在您的angular.json 中。
您是否在类型文件中声明了ejPivotrGrid？像这样的东西 - interface JQuery{ejPivotGrid(options: any): JQuery;}
嗨@Sam，你能详细说明一下吗？是不是我必须创建 *.d.ts 文件并在其中声明一个接口？

标签： jquery angular angular8 syncfusion

【解决方案1】：

根据您的要求，我们在 Angular 8 中准备了一个示例供您参考。请检查以下示例和文档链接。

示例链接：https://www.syncfusion.com/downloads/support/directtrac/general/ze/sample1592888818

文档链接：https://help.syncfusion.com/angular/pivotgrid/getting-started#relational

我们希望上述样品符合您的要求。如果问题仍然存在，请在提供的示例中重现问题并回复我们。这将有助于我们进一步进行。

【讨论】：