Как настроить бесплатную jqGrid в Angular 2

#jquery #angular #jqgrid #free-jqgrid

#jquery #angular #jqgrid #бесплатно-jqgrid

Вопрос:

Я пытался следовать некоторым объяснениям на этом сайте об установке бесплатной jqGrid, но безуспешно.

Сначала я перезаписал пример Олега в jsfiddle. Это то, что я сделал https://jsfiddle.net/m8ap1dkb/1 / (который работает, как и ожидалось)

Затем вставил его в мой проект angular, но, похоже, он не создается. Он отображается пустым.

В Angular я установил free-jqGrid и jquery, используя статические данные для сетки.

HTML

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

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

Если кто-то может помочь, я ценю.

Ответ №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",
  ...
]