如何在 Angular 2+ 中设置免费的 jqGrid答案

【问题标题】：How to setup free jqGrid in Angular 2+如何在 Angular 2+ 中设置免费的 jqGrid
【发布时间】：2021-02-06 02:56:01
【问题描述】：

我尝试按照这个网站上的一些解释来安装免费的 jqGrid，但没有成功。

首先，我在 jsfiddle 中覆盖了 Oleg 的一个示例。这就是我所做的https://jsfiddle.net/m8ap1dkb/1/ （按预期工作）

然后将它粘贴到我的 Angular 项目中，但它似乎没有构建。它显示为空白。

在 Angular 中，我使用网格的静态数据安装了 free-jqGrid 和 jquery。

HTML

<table id="grid"></table>

组件.ts

import * as $ from 'jquery';

ngOnInit() {
$( () => {
      "use strict";
      (<any>$("#grid")).jqGrid({... (as in fiddle)

angular.json 包含

"scripts": [
   ...
   "node_modules/jquery-ui/themes/base/all.css",
   "node_modules/free-jqgrid/css/ui.jqgrid.min.css"
 ],
"scripts": [
   "node_modules/jquery/dist/jquery.min.js",
   "node_modules/free-jqgrid/js/jquery.jqgrid.min.js",
   "node_modules/jquery/dist/jquery.js",
   "node_modules/jquery-ui-dist/jquery-ui.min.js",
   ...
 ]

如果有人可以提供帮助，我将不胜感激。

【问题讨论】：

标签： jquery angular jqgrid free-jqgrid

【解决方案1】：

嗯，我不知道我所做的具体更改，但我已经解决了。

使用“declare var $: any;”而不是“import * as $ from 'jquery';”，如旧帖子中所述。

但请注意，我在创建此问题之前已经尝试过，所以也许这不是唯一要解决的问题。

我还删除了脚本中的一行并重新排序。

"scripts": [
  "node_modules/jquery/dist/jquery.min.js",
  "node_modules/jquery-ui-dist/jquery-ui.min.js",
  "node_modules/free-jqgrid/js/jquery.jqgrid.min.js",
  ...
]

【讨论】：