kendo-ui 相关问题

我有不同的组件，我在命令列中使用带有删除按钮的 KendoUI Angular Grid：我有不同的组件，我在命令列中使用带有删除按钮的 KendoUI Angular Grid： <kendo-grid-command-column [width]="40"> <ng-template kendoGridCellTemplate let-dataItem> <button class="outgoing-delete-button" id="gridDeleteButton" kendoButton themeColor="primary" fillMode="clear" kendoGridRemoveCommand onClick="event.stopPropagation()" > <i class="fa fa-trash" aria-hidden="true"></i>  </button> </ng-template> </kendo-grid-command-column> 我使用 npm-check-updates 来更新 @progress 组件，这是我的 package.json: "dependencies": { "@angular/animations": "~17.3.7", "@angular/common": "~17.3.7", "@angular/compiler": "~17.3.7", "@angular/core": "~17.3.7", "@angular/forms": "~17.3.7", "@angular/localize": "~17.3.7", "@angular/platform-browser": "~17.3.7", "@angular/platform-browser-dynamic": "~17.3.7", "@angular/platform-server": "~17.3.7", "@angular/router": "~17.3.7", "@fortawesome/angular-fontawesome": "^0.14.1", "@fortawesome/fontawesome-common-types": "^6.5.2", "@fortawesome/fontawesome-svg-core": "^6.5.2", "@ngx-translate/core": "^15.0.0", "@ngx-translate/http-loader": "^8.0.0", "@progress/kendo-angular-buttons": "^15.5.0", "@progress/kendo-angular-common": "^15.5.0", "@progress/kendo-angular-dateinputs": "^15.5.0", "@progress/kendo-angular-dialog": "^15.5.0", "@progress/kendo-angular-dropdowns": "^15.5.0", "@progress/kendo-angular-excel-export": "^15.5.0", "@progress/kendo-angular-grid": "^15.5.0", "@progress/kendo-angular-icons": "^15.5.0", "@progress/kendo-angular-indicators": "^15.5.0", "@progress/kendo-angular-inputs": "^15.5.0", "@progress/kendo-angular-intl": "^15.5.0", "@progress/kendo-angular-l10n": "^15.5.0", "@progress/kendo-angular-label": "^15.5.0", "@progress/kendo-angular-layout": "^15.5.0", "@progress/kendo-angular-listview": "^15.5.0", "@progress/kendo-angular-menu": "^15.5.0", "@progress/kendo-angular-navigation": "^15.5.0", "@progress/kendo-angular-notification": "^15.5.0", "@progress/kendo-angular-pdf-export": "^15.5.0", "@progress/kendo-angular-popup": "^15.5.0", "@progress/kendo-angular-progressbar": "^15.5.0", "@progress/kendo-angular-ripple": "^15.5.0", "@progress/kendo-angular-tooltip": "^15.5.0", "@progress/kendo-angular-treeview": "^15.5.0", "@progress/kendo-data-query": "^1.7.0", "@progress/kendo-drawing": "^1.20.1", "@progress/kendo-licensing": "^1.3.5", "@progress/kendo-svg-icons": "^2.3.0", "@progress/kendo-theme-default": "^7.2.1", "@types/lodash": "^4.17.1", "angular-oauth2-oidc": "^17.0.2", "bootstrap": "^5.3.3", "cldr-core": "^45.0.0", "cldr-dates-full": "^45.0.0", "cldr-numbers-full": "^45.0.0", "jquery": "^3.7.1", "kendo-ui-license": "^1.0.1", "locale-codes": "^1.3.1", "npm-check-updates": "^16.14.20", "oidc-client": "^1.11.5", "popper.js": "^1.16.0", "run-script-os": "^1.1.6", "rxjs": "~7.8.1", "zone.js": "~0.14.5" }, "devDependencies": { "@angular-devkit/build-angular": "~17.3.6", "@angular-eslint/builder": "17.3.0", "@angular-eslint/eslint-plugin": "17.3.0", "@angular-eslint/eslint-plugin-template": "17.3.0", "@angular-eslint/schematics": "17.3.0", "@angular-eslint/template-parser": "17.3.0", "@angular/cli": "~17.3.6", "@angular/compiler-cli": "~17.3.7", "@types/jasmine": "~5.1.4", "@types/jasminewd2": "~2.0.13", "@types/jquery": "^3.5.29", "@types/node": "^20.12.8", "@typescript-eslint/eslint-plugin": "^7.8.0", "@typescript-eslint/parser": "^7.8.0", "eslint": "^9.2.0", "jasmine-core": "~5.1.2", "karma": "~6.4.3", "karma-chrome-launcher": "~3.2.0", "karma-coverage": "~2.2.1", "karma-jasmine": "~5.1.0", "karma-jasmine-html-reporter": "^2.1.0", "ngx-translate-testing": "^7.0.0", "tslib": "^2.6.2", "typescript": "^5.4.5" } 自从我将应用程序升级到 Angular 版本“17.3.7”并将 @progress 组件升级到版本“15.5.0”后，我收到此错误。我正在努力解决这个问题，请帮忙。 Error: NG0300: Multiple components match node with tagname button: ButtonComponent and RemoveCommandDirective. Find more at https://angular.io/errors/NG0300 at throwMultipleComponentError (core.mjs:9916:11) at findDirectiveDefMatches (core.mjs:11970:29) at resolveDirectives (core.mjs:11770:29) at elementStartFirstCreatePass (core.mjs:22977:5) at Module.ɵɵelementStart (core.mjs:23013:9) at Component_ng_template_32_Template (component.html:189:9) at executeTemplate (core.mjs:11268:9) at renderView (core.mjs:12470:13) at createAndRenderEmbeddedLView (core.mjs:12540:9) at TemplateRef.createEmbeddedViewImpl (core.mjs:13393:31) 我通过删除触发网格的内置事件删除的命令指令kendoGridRemoveCommand来修复错误，并将其替换为带有单击事件的简单按钮。 <kendo-grid-command-column [width]="40"> <ng-template kendoGridCellTemplate let-dataItem> <button id="gridDeleteButton" kendoButton themeColor="primary" fillMode="clear" [disabled]="appUser.hasStatRole" (click)="onDelete($event, dataItem.requestId)" > <i class="fa fa-trash" aria-hidden="true"></i>  </button> </ng-template> </kendo-grid-command-column>

angular kendo-ui kendo-grid

回答 1 投票 0

package.json 用于角度 17

我已经完成了从角度 16 到 17 的版本，但没有成功。我希望你能帮忙。现在是 package.json 文件。 “依赖项”：{ “@角度/动画”：“^17.3.4...

angular kendo-ui package.json

回答 1 投票 0

Telerik Kendo MVC TabStrip - 如何在加载部分视图时设置焦点

我有一个带有部分视图的剑道选项卡。当我单击选项卡时，将加载部分视图。但我需要将 focus() 和/或 tabindex 设置为部分视图中的特定元素，以供考试......

kendo-ui

回答 1 投票 0

在 Kendo Angular Grid 中对列菜单进行排序

我可以使用 Jquery 对 Kendo Grid 中的列菜单进行排序，如下所示 $("#grid").kendoGrid({ 列： [ { 字段：“姓名” }, { 字段：“年龄”...</desc> <question vote="0"> <p>我可以使用 Jquery 对 Kendo Grid 中的列菜单进行排序，如下所示</p> <pre><code> <script> $("#grid").kendoGrid({ columns: [ { field: "name" }, { field: "age" }, { field: "city" } ], **columnMenu: { columns: { sort: 'asc' } },** sortable: true, dataSource: [ { name: "Jane Doe", age: 30, city: "London" }, { name: "John Doe", age: 33, city: "Madrid" } ] }); </script> </code></pre> <p>但我不知道我们如何在 Kendo Angular 网格中做同样的事情？任何人都可以帮助以角度实现这一点吗？</p> </question> <answer tick="false" vote="0"> <p>我能够解决这个问题。以下是解决方案：</p> <p>模板代码</p> <pre><code><ng-template kendoGridColumnMenuTemplate let-service="service"> <kendo-grid-columnmenu-sort [service]="service"></kendo-grid-columnmenu-sort> <kendo-grid-columnmenu-filter [service]="service"></kendo-grid-columnmenu-filter> <div class="dropdown"> <div class="dropbtn">Columns</div> <div class="dropdown-content"> <div style="height: 200px; overflow-y: auto"> <div *ngFor="let col of columns; let i = index"> <div class="k-column-list-item"> <input type="checkbox" kendoCheckBox [(ngModel)]="col.hidden" (click)="columnClicked(i)">{{ col.title }} </div> </div> </div> <div style="padding: 6px"> <button style="margin: 2px" kendoButton type="button" (click)="resetCheckboxes()"> <span>Reset</span> </button> <button style="margin: 2px" kendoButton type="button" (click)="applyColumnChooser()"> <span>Apply</span> </button> </div> </div> </div> </ng-template> </code></pre> <p>代码：</p> <pre><code>sortColumnChooser() { this.columns = this.defaultGridSettings.columns.slice().sort((a, b) => a.title.localeCompare(b.title)) .map(column => ({ field: column.field, hidden: !column.hidden, title: column.title })); this.originalCheckboxes = this.columns.map(col => col.hidden); }columnClicked(columnIndex: number) { var field = this.columns[columnIndex].field; if (!this.columnFields.find(item => item.field === field)) { this.columnFields.push({ field: field }); } } applyColumnChooser() { this.columnFields.forEach(column => { let gridColumn = this.gridSettings.columns.findIndex((col) => col.field === column.field); if (gridColumn !== -1) { this.gridSettings.columns[gridColumn].hidden = !this.gridSettings.columns[gridColumn].hidden; } }); this.originalCheckboxes = []; this.sortColumnChooser(); this.extended = true; if(this.columnFields.length !== 0){ this.refresh(); } this.columnFields = []; } resetCheckboxes(): void { this.columns.forEach((col, index) => { col.hidden = this.originalCheckboxes[index]; }); this.columnFields = [];} </code></pre> <p>我在<strong>ngOnInit</strong><strong>中调用了方法</strong>sortColumnChooser()</p> </answer> </body></html>

angular kendo-ui kendo-grid

回答 0 投票 0

Angular 17 - 无法绑定到“routerLink”，因为它不是“a”的已知属性

自从我将 Angular 升级到版本 17 以来，我收到此错误，我在项目的根目录导入 RouterModule，它在升级之前工作正常，但我没有找到如何修复此错误。可以...

angular typescript kendo-ui

回答 1 投票 0

如何区分 Kendo UI（服务器）和 Kendo UI（客户端）？

我正在使用ASP.Net Core 6。我被迫使用Kendo UI来构建表格（Grid）。 Kendo UI 有 2 种“风格”：我所说的“服务器”： @(Html.Kendo().Grid().Name...

kendo-ui telerik kendo-grid kendo-asp.net-mvc

回答 1 投票 0

升级到 Angular 17 - 错误：node_modules/@types/node/globals.d.ts:72:13 - 错误 TS2403：后续变量声明必须具有相同的类型

我按照此处的步骤 https://update.angular.io/?v=16.0-17.0 将 Angular 从版本 16 升级到 17，并更新了我所知道的所有依赖项以升级 Angular 17 版本。我更新了@angular-eslint/