Позвольте мне задать вопрос: как мне нужно настроить веб-пакет для CLI Angular 2+ (в настоящее время я использую Angular 6), чтобы использовать сетку Kendo UI для jQuery внутри Angular 6?
Моя проблема в том, что я добавил в проект Angular 6 два файла: kendo.all.min.js и jquery-1.12.4.min.js.
добавлено в html файл
<div id="grid"></div>
Внутри компонента машинописного текста я добавил импорт:
import * as kendo from '../../../../assets/kendo.all.min.js';
import * as jQuery from '../../../../assets/jquery-1.12.4.min.js';
ngOnInit() {
$(document).ready(function () {
var dataSource = new kendo.data.DataSource({
transport: {
read: {
url: "https://demos.telerik.com/kendo-ui/service/products",
dataType: "jsonp"
}
},
pageSize: 10
});
$("#grid").kendoGrid({
dataSource: dataSource,
pageable: true
});
});
}
и в функции ngOnInit я получаю сообщение об ошибке в ".kendoGrid({" строка Ошибка: "ERROR TypeError: _assets_jquery_js__WEBPACK_IMPORTED_MODULE_7__(...).kendoGrid не является функцией"
мой файл angular.json:
"MyProject": {
"root": "",
"sourceRoot": "projects/src",
"projectType": "application",
"prefix": "projects/src",
"schematics": {},
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
"outputPath": "dist/MyProject",
"index": "projects/src/index.html",
"main": "projects/src/main.ts",
"polyfills": "projects/src/polyfills.ts",
"tsConfig": "projects/src/tsconfig.app.json",
"assets": [
"projects/src/favicon.ico",
"projects/src/assets"
],
"styles": [
"projects/src/styles.css",
"node_modules/@progress/kendo-theme-default/dist/all.css",
"assets/kendo/styles/kendo.common-bootstrap.min.css",
"assets/kendo/styles/kendo.bootstrap.min.css",
"assets/app-angular.css",
"assets/main.css",
"assets/index.css",
"assets/angle/theme-f.css",
"assets/fonts/fontawesome/css/font-awesome.min.css",
"assets/fonts/simple-line-icons/css/simple-line-icons.css",
"assets/fonts/katimavik/css/katimavik-font.css",
"assets/angular/ngDialog/css/ngDialog.min.css",
"assets/landing.css",
"assets/adeco/adeco-katimavik.min.css"
],
"scripts": [
"projects/assets/kendo.js"
]
},
"configurations": {
"production": {
"fileReplacements": [
{
"replace": "projects/src/environments/environment.ts",
"with": "projects/src/environments/environment.prod.ts"
}
],
"optimization": true,
"outputHashing": "all",
"sourceMap": false,
"extractCss": true,
"namedChunks": false,
"aot": true,
"extractLicenses": true,
"vendorChunk": false,
"buildOptimizer": true
}
}
},
"serve": {
"builder": "@angular-devkit/build-angular:dev-server",
"options": {
"browserTarget": "Katimavik:build"
},
"configurations": {
"production": {
"browserTarget": "Katimavik:build:production"
}
}
},
"extract-i18n": {
"builder": "@angular-devkit/build-angular:extract-i18n",
"options": {
"browserTarget": "Katimavik:build"
}
}
}
}
Как я могу настроить свою среду Angular 6, чтобы иметь возможность использовать сетку пользовательского интерфейса Kendo для jQuery внутри Angular 6?
Пожалуйста, дайте мне знать, если вам нужна дополнительная информация.
Спасибо.
P.S.
Мне нужен пользовательский интерфейс Kendo для jQuery в Angular 6, потому что я пытаюсь выполнить миграцию с AngularJS на Angular 6. И внутри angularJS я использовал много сетки кендо для jQuery.
Поэтому, если я могу импортировать и настраивать kendo.all.min.js в своем проекте, мне не нужно переписывать каждую сетку кендо для jQuery, а просто повторно использовать существующую сетку кендо для jQuery.
