Angular Kendo Grid是不可滚动的，并允许高度适合行内容吗？
Angular Kendo Grid是一个用于构建数据表格的组件，它提供了丰富的功能和灵活的配置选项。关于它是否可滚动并允许高度适应行内容，答案是肯定的。
Angular Kendo Grid可以通过设置属性来实现滚动和高度适应行内容的功能。具体来说，可以使用scrollable属性来启用滚动功能，并使用height属性来设置表格的高度。
当scrollable属性设置为true时，表格将显示滚动条，以便在内容溢出时进行滚动。这对于处理大量数据或需要显示大量列的情况非常有用。
另外，通过将height属性设置为auto，表格的高度将根据行内容自动调整，以适应所有行的高度。这在需要根据数据动态调整表格高度的情况下非常有用。
以下是一些使用Angular Kendo Grid的示例场景和相关的腾讯云产品：
- 电商网站的商品列表：使用Angular Kendo Grid可以轻松地展示商品信息，包括名称、价格、库存等。相关的腾讯云产品是云数据库MySQL版，用于存储商品数据。产品介绍链接：云数据库 MySQL 版
- 学生成绩管理系统：使用Angular Kendo Grid可以展示学生的成绩信息，并支持排序和筛选功能。相关的腾讯云产品是云服务器，用于部署和运行应用程序。产品介绍链接：云服务器
- 新闻网站的文章列表：使用Angular Kendo Grid可以展示新闻文章的标题、作者、发布日期等信息，并支持分页功能。相关的腾讯云产品是对象存储，用于存储文章的图片和附件。产品介绍链接：对象存储
请注意，以上只是一些示例场景，实际应用中可能需要根据具体需求选择适合的腾讯云产品。
相关·内容
如何使Angular中的Kendo Grid不可滚动，并允许高度适合行内容？
这目前不能工作，它仍然给我一个固定的高度。
<kendo-grid [data]="propertyViews" [style.height.%]="100"
[selectable]="false"
[filterable]="false"
scrollable="none"
[sortable]="false"
[pageable]="false"
[loading]=&#
浏览 8提问于2019-11-02得票数 1
回答已采纳
2回答
我要我的网格有一个动态高度。在有角1和剑道之前，我会这样做。
<kendo-grid id="grid" options="entityGrid.gridOptions"></kendo-grid>
使用以下CSS：
#grid {
height: calc(100% - 1em);
}
但是对于用于angular2的Kendo网格，当我尝试这种方法时，它是行不通的。
<kendo-grid id="grid"
[data]="entityGrid?.view | async&
浏览 1提问于2016-11-24得票数 7
回答已采纳
我的WPF应用程序中有一个UserControl，它需要有3个垂直方向的Expander控件。
<Grid Margin="0,-3,0,0" Height="430" Width="Auto">
<Grid.RowDefinitions/>
<ScrollViewer>
<StackPanel Height="430" ScrollViewer.VerticalScrollBarVisibility="Auto&
浏览 3提问于2014-03-14得票数 0
回答已采纳
我正在尝试将Angular 2的kendo UI连接到我的应用程序上，但我遇到了一些问题。
这是我的system.config.js：
map: {
// our app is within the app folder
app: 'app',
// angular bundles
'@angular/core': 'npm:@angular/core/bundles/core.umd.js',
'@angular/common': 'npm:@angular/common/b
浏览 1提问于2017-03-10得票数 0
1回答
如何在垂直滚动网格时冻结剑道网格的标题行(就像我们在excel中“冻结窗格”一样)？在阅读了kendo网格api之后，我尝试在[headerStyle]="{'position': 'fixed'}"标记中使用kendo-grid-column，但是它使所有的标题相互重叠。任何建议都是值得赞赏的。
浏览 9提问于2017-11-24得票数 2
回答已采纳
我有一个具有大量列的Kendo UI网格(50)。尽管用户可能只选择几列来查看，但他/她需要能够从50列中的任何一列中进行选择。不幸的是，在大多数显示器上，kendo grid列菜单将大于显示。有没有办法使列菜单可滚动或设置列菜单中的子菜单(包含多组列)？
此外，我发现kendo Grid组件的初始创建速度很慢，无法使用列菜单构建50列。甚至在最初隐藏所有列时也是如此。如果上面的视图问题可以解决，请让我知道是否也有方法来帮助提高性能。在此之前，非常感谢您。
浏览 1提问于2012-10-02得票数 3
我有一个剑道网格：
<kendo-grid
[data]="gridData"
[pageSize]="state.take"
[skip]="state.skip"
[sort]="state.sort"
[filter]="state.filter"
[sortable]="true"
[pageable]="true"
[filterable]="true"
[kendoGridSelectBy]="'guid'"
[se
浏览 3提问于2017-10-18得票数 0
回答已采纳
1回答
我使用构建了一个数据网格，其中给出了每一列的大小，并将命令按钮“编辑、更新、取消”作为最后一列。由于列的大小，网格会得到水平滚动条。仅允许在最后两个字段列中进行编辑。当我点击“编辑”按钮时，行滚动到最左边，我的可编辑列+命令按钮(“更新”和“取消”)隐藏起来，这对用户来说是奇怪或不喜欢的。同样，用户必须向右滚动并执行更新/取消操作。有没有人有办法解决这个问题。
<kendo-grid [kendoGridBinding]="view" [height]="700" [pageSize]="25" [pageable]="true&#
浏览 1提问于2017-10-26得票数 0
我正试图为我的自定义组合框创建一个无边界的下拉表单。下拉表单包括一个网格，用户可以从中选择项目。在大多数情况下，它是有效的。但是，我注意到网格底部有不包含任何数据的空间。我已经把AllowUserToAddRows设为假了。额外的空间甚至不包括单元格--它只是空白的控制空间。为了确保额外的空间在网格(而不是表单)中，我将网格BackgroundColor设置为黄色，它显示在表单中，因此我知道额外的空间在网格中。
注意:我是以编程方式将网格添加到表单中。我不确定这是否重要。并且，我正在根据网格大小调整表单大小。窗体宽度设置为网格宽度。如果网格包含超过10行，我将表单高度设置为仅显示10行，并且垂
浏览 10提问于2011-11-17得票数 0
1回答
我使用的是Kendo UI的JSP包装器版本。
目前，我的网格有一个固定的高度：
<kendo:grid name="SUBUL_02_GRID" pageable="true" resizable="true"
sortable="true" height="800">
我希望网格占据页面的剩余空间，但将height=设置为“100%”不起作用。高度被设置为某个任意值，该值小于页面的50%。
我不确定这是否重要，但我也启用了虚拟滚动
<kendo:grid-scroll
浏览 0提问于2013-03-25得票数 0
我试图将excel导出功能添加到Kendo UI angular 2网格中，但在angular 2应用程序加载时出现错误：
Can't bind to 'toolbar' since it isn't a known property of 'kendo-grid'.
下面是我使用的代码片段：
<kendo-grid [data]="gridView" [height]="700" [pageSize]="pageSize"
[toolbar]=
浏览 1提问于2016-12-01得票数 8
我已经实现了一个使用的角2应用程序
在使用AoT +Rollup部署应用程序时，我被困住了：
错误：“GridModule”不是由GridModule导出的(由app\app.module.js导入)。
从汇总文档中尝试了，但我不知道如何配置namedExports
commonjs({
namedExports: {
'node_modules/@progress/kendo-angular-grid/dist/npm/js/main.js': [ 'GridModule' ]
}
});
使用上述配置并不能解决问题。
编辑:最后，我对网格的工
浏览 8提问于2016-11-04得票数 2
回答已采纳
1回答
我有一个Kendo网格，它放置在一个页面上，它跨越整个可见页面(宽度和高度)。如果行太多，网格将显示一个滚动条。
但是，当我将网格放置在Kendo TabStrip (高度为100%)中时，网格的高度变得无限，没有显示滚动，页面外的行不可见(不能滚动到)。
如何将网格限制在制表符的高度？
浏览 0提问于2015-06-24得票数 0
回答已采纳
3回答
我希望将红色应用于其completedIn hours列值大于24的行。我该怎么做呢。请帮帮忙，我刚接触angular。
<kendo-grid [kendoGridBinding]="gridData">
<kendo-grid-column field="RequestNumber" title="Request No."
width="110" >
</kendo-grid-column>
<kendo-grid-column field="Request
浏览 33提问于2019-02-06得票数 6
面对Angular 2的网格的虚拟滚动问题。网格只需滚动到第一页，然后PageChangeEvent就不会触发。我可以向下滚动，但它只是一个空白区域。什么会影响PageChangeEvent？然而，当我向上滚动到最顶部时，滚动被触发，但字段是{ PageChangeEvent : NaN，take: undefined}。有什么想法吗？
我猜可能是因为依赖关系吧？这是我的pachage.json：
"dependencies": {
"@angular/animations": "^4.0.2",
"@angular/common&
浏览 0提问于2017-04-14得票数 0
1回答
使用Telerik模块和网格模块中指定的汇总设置无法获得“orderBy”。其他模块，如GridModule、SharedModule、IntlService也正在解决。
以下是我命名的出口：
import rollup from 'rollup'
import nodeResolve from 'rollup-plugin-node-resolve'
import commonjs from 'rollup-plugin-commonjs';
import uglify from 'rollup-plugin
浏览 6提问于2016-12-05得票数 1
回答已采纳
1回答
我无法在angular4 中的kendo网格中添加按钮。
还有其他添加按钮的方法吗？
<kendo-grid
[data]="view | async"
[pageSize]="state.take"
[skip]="state.skip"
[sort]="state.sort"
[sortable]="true"
[pageable]="true"
[scrollable]="'none'"
[f
浏览 0提问于2018-02-21得票数 0
2回答
我正在开发一个角2应用程序使用asp.net在视觉工作室。呈现的HTML使用的是Kendo数据集。我正在努力实现，滚动和排序。卷轴运转得很好。但是，在尝试实现排序时有问题。我搞错了
错误是“对象文本不能在严格模式下具有相同名称的多个属性。重复标识符数据”。这是编译时错误。
此错误引用loadRisks()方法中的数据属性赋值。我刚开始打字，需要一些帮助。如何将order子句分配给datagrid。有人能帮忙吗。
risk-list.component.ts
import { Component, OnInit } from '@angular/core';
import { R
浏览 6提问于2016-10-23得票数 2
回答已采纳
1回答
我正在使用Kendo的角度，我目前正在尝试做一个简单的工作。
这是我的密码：
<!-- my-comp.component.html -->
<kendo-grid
[data]="options"
[selectable]="selectableSettings"
>
<kendo-grid-checkbox-column [width]="50"></kendo-grid-checkbox-column>
<kendo-grid-column
*ngFor=
浏览 1提问于2020-06-03得票数 0
回答已采纳
我使用了Kendo角度DatePicker的基本用法示例。
但是，当单击DatePicker时，如果有滚动条，则会将其滚动到一个不同的位置来打开DatePicker。
Html：
<kendo-datepicker ></kendo-datepicker>
package.json看起来像：
"@progress/kendo-angular-dateinputs": "^2.2.0",
"@progress/kendo-angular-intl": "^1.4.0",
"@progress/kend
浏览 1提问于2018-04-16得票数 1
回答已采纳
2回答
我希望剑道窗口的高度和宽度是为剑道网格的内容动态设置的这是我的剑道窗口
<div kendo-window="Operation.OperCustWind"
k-width="800"
k-height="700"
id="operCustWindow"
k-visible="false"
modal="true"
k-on-close="Operation.closeOper
浏览 1提问于2017-05-18得票数 1
我想在Angular4上使用Kendo-Grid，但我一直收到这个错误：
Uncaught Error: Template parse errors:
'Kunden-grid' is not a known element:
1. If 'Kunden-grid' is an Angular component, then verify that it is part of this module.
2. If 'Kunden-grid' is a Web Component then add 'CUSTOM_ELEMENTS_SCHE
浏览 9提问于2017-06-14得票数 1
见Stackblitz 。
我想显示callCount的实时显示，因为rowCallback()正在被调用，每个Kendo单元都会被检查。
我期望最终的callCount数是12 (即3行x4个单元格= 12)。
我得到了经典的ExpressionChangedAfterItHasBeenCheckedError错误。在Telerik网站：上没有提到任何有用的东西。
方便代码：
import { Component, ViewEncapsulation } from '@angular/core';
import { RowClassArgs } from '@prog
浏览 9提问于2020-11-04得票数 1
回答已采纳
我一直在尝试在angular2的kendo-grid中实现拖放功能，以更改网格中列的顺序。
我注意到有一个可以拖放的kendo-sortable，但是我不知道如何使用这个特性来实现kendo-grid。
浏览 1提问于2017-04-27得票数 1
我正在尝试使用kendo.alert函数而不是普通的javascript警告--但每当我传入大量文本(例如，许多带换行符的段落)时，警告框就会超出当前窗口的高度，这意味着您只能看到文本的底部加上OK按钮。有没有办法在kendo.alert上启用滚动条，这样你就可以看到所有的行？
浏览 1提问于2018-06-05得票数 0
2回答
我有3个模态窗口，每个窗口中都有Kendo网格，但是当数据较少时，它们会在底部显示一个空白。有没有办法自动调整网格的大小。下面是jsfiddle示例：
var myWindow = $('#myWindow').kendoWindow({
title: "My Window",
width: 500,
height: 400,
open: function() {
$('#grid').kendoGrid({
dataSource: {
type: "odata",
浏览 0提问于2016-08-30得票数 0
回答已采纳
有没有人可以帮我在angular中以编程方式选择剑道网格行。我可以按行号选择一行。我不能想出一种方法来根据某一列的内容来选择行。
HTML：
<body ng-controller="MainCtrl">
<p>Hello {{name}}!</p>
<div kendo-grid="myGrid" k-options="myOptions" k-selectable="'row'" k-on-change="myGridChange()"
浏览 0提问于2014-03-28得票数 5
我有angular 2 rc.1应用程序。问题是我试图通过在kendo-grid中嵌套一个带有kendoPagerTemplate指令的ng模板来覆盖现有的分页程序。就像-
<kendo-grid>
...
<ng-template kendoPagerTemplate>
<!-- add custom components or reuse existing pager elements --->
</ng-template>
</kendo-grid>
但我得到了以下错误-
我的代码
浏览 11提问于2018-01-03得票数 1
回答已采纳
我有一些奇怪的图形问题，滚动网格，同时有一些细节项目打开。模板：
<kendo-grid
[data]="gridView"
[skip]="skip"
[pageSize]="pageSize"
[scrollable]="'virtual'"
[rowHeight]="41"
[height]="700"
[detailRowHeigh
浏览 0提问于2016-12-28得票数 1
1回答
我正在尝试实现一个带有行重排序功能的Kendo，如广告中所示的。
当网格处理通过Ajax调用获取的数据时，行的重新排序(即拖放一行)直到视图更改(对于ex:直到用户单击本例中分页中的第二个页面)才能工作。
下面是我的app.component.ts文件
import { State, process } from '@progress/kendo-data-query';
import { Component, Renderer2, NgZone, AfterViewInit, OnInit, EventEmitter, OnDestroy } from '@angul
浏览 2提问于2018-01-06得票数 5
回答已采纳
我们有一个angular2 webapp，我们使用Kendo Grid来显示数据。我们使用JSDO从restful风格的We服务中检索数据。我们需要能够检测到行何时被渲染。原因是我们需要在默认情况下选择第一行，并在网格外部的字段中显示一些额外的数据。
最初的Kendo Grid有一个我们可以订阅的dataBound事件。我们还没能在Angular2 grid中找到对应的东西。
浏览 1提问于2017-02-10得票数 2
当我试图水平滚动Kendo Angular2网格时，我在IE11中遇到了性能不足的问题。列数可能会不时更改。至少我每次都有30栏。或者冻结UI超过10秒，甚至崩溃。
我的网格版本是0.5.0。以下是我的网格设置：
<kendo-grid
[data]="view"
[scrollable]="'virtual'"
[height]="gridHeight"
[pageSize]="pageSize"
[rowHeight]="rowHeight"
浏览 2提问于2016-11-21得票数 0
回答已采纳
我在Angular中使用了一个kendo ui网格，其html如下： <kendo-grid
[kendoGridBinding]="absortCommunicationOverview"
[height]="510"
[pageSize]="10"
[pageable]="true"
[sortable]="true"
[filterable]="true"
[selectable]="selectableSettings"
kendoGridSelectBy
浏览 23提问于2020-11-24得票数 0
回答已采纳
我们使用的是ag-grid。我们希望拥有与kendo-grid autoBind: false相同的功能。因此，网格不会做任何事情，直到单击一个按钮，并且网格被服务器端无限滚动分页触发。
我们如何在Angular中使用ag-grid来做到这一点呢？
浏览 0提问于2018-11-12得票数 1
1回答
我想用rowTemplate和detailTemplate做一个剑道网格。在rowTemplate中，我想多放一行(tr)。它呈现得很好，但最后一个主行不展开。参见jsfiddle中的示例：
模板和网格：
<div id="grid"></div>
<script id="rowTemplate" type="text/x-kendo-tmpl">
<tr class="k-master-row">
<td class="k-hierarch
浏览 3提问于2017-03-28得票数 1
回答已采纳
您好，我有一个绑定到集合的ListView。我将ListView的高度设置为auto，以便它占据区域中的所有空间。但是，在我将高度设置为auto后，没有出现滚动条。如果我给它一个高度，那么滚动条就会出现。
标记非常类似于下面的内容
<Grid>
<StackPanel>
<Expander>
<DataGrid>
<Expander>
<ListView>
浏览 53提问于2011-06-03得票数 23
回答已采纳
我对Kendo UI和Angular2非常陌生。我正在使用带有Angular2的Kendo ui。我在每个行都有一个带有复选框的网格模块。我想知道每行select时的rowid或任何字段的值。如何在typescript中做到这一点。下面的代码是app.component.ts
import { Component } from '@angular/core';
import { products } from './products';
@Component({
selector: 'my-app',
template: `
浏览 0提问于2017-05-09得票数 1
2回答
是否有任何方法从代码中选择网格行，以便触发事件发射器？我不知道如何获得网格组件并手动执行事件。
选择网格
<kendo-grid [data]="gridView" [selectable]="true"></kendo-grid>
--
编辑:如果我通过在kendo网格标记中添加一个#gridReference标记来手动访问网格，我可以使用
@ViewChild('activityGrid') gridReference: GridComponent;
但在执行时
var selectionEvent = { index
浏览 2提问于2016-10-10得票数 1
回答已采纳
2回答
我对Angular有些陌生，正在尝试学习如何在没有jQuery的情况下使用Angular来使用Kendo Grid。我得到的用于小部件配置的jQuery代码是用javascript编写的，但是我没有得到HTML指令。
<kendo-grid options="mainGridOptions">
"options“属性是什么意思？我假设它是kendo-grid (由指令定义)小部件具有的属性？但是当我打开时，我没有在字段配置下拉列表中看到它吗？
浏览 1提问于2015-10-09得票数 0
1回答
你好，我在kendo ui grid中显示数据有问题。当我在应用程序启动时直接加载模块时，它工作得很好，但是当我试图通过延迟加载加载它时，我得到了以下错误：
无法设置未定义的属性“堆栈”
如果我从html中删除了kendo网格，那么它会很好地加载页面的其余部分，但是对于网格，它总是会产生上述错误。
我想问题是因为吊带本身在装载时身份不明，但我不知道在哪里或如何修复它.另外，如果需要其他代码片段，我将在稍后发布它们。
包含网格的HTML：
<kendo-grid [data]="gridData"
[pageSize]="displaySize
浏览 0提问于2017-01-24得票数 1
回答已采纳
我之前已经看到这个问题在Angular 2中被问了几次，但是我没有看到一个问题特别问到Angular 6或7。
我有一个页面的多个网格，我试图导出为一个excel文件。即使是多个工作表。
<!-- Section header 1 -->
<kendo-grid [data]="data.something" scrollable="none">
<kendo-grid-column field="item"></kendo-grid-column>
<kendo-grid-colum
浏览 0提问于2018-12-08得票数 0
我正在尝试在集成Angular Kendo UI时正确触发ng-click事件。
在下面的中，单击按钮click me，将出现一个模式窗口，但是如果我将kendo-grid属性添加到index.html的第18行，则弹出窗口不起作用。例如更改：
<table>
至：
<table kendo-grid>
则模式弹出窗口不起作用。我怀疑当网格被渲染时，angular会丢失绑定。不确定如何修复它。有人能帮上忙吗？
浏览 0提问于2013-06-23得票数 0
回答已采纳
我正在开发的角度2应用程序，即使用KendoUI数据在asp.net web应用程序。我已经将index.html设置为启动页面。当我按F5时，index.html会加载。单击“风险”菜单将显示在risk-list.component.html页面中定义的数据与数据。它的网址是localhost/risks。如果按F5，就会得到404页未找到错误。谁能告诉我问题可能是什么，我该怎么解决？
这是我的密码：
risk-list.Component.ts
import { Component, OnInit } from '@angular/core';
import { Risk
浏览 6提问于2016-10-17得票数 3
回答已采纳
我有一些放在中的动态内容。根据内容的高度，它会滚动。有时，由于内容高度的原因，没有滚动。我只想知道，有没有办法根据内容的高度，以编程方式检测ScrollView容器是否可滚动？
浏览 0提问于2019-11-27得票数 0
运行Jest测试文件时出错：
TypeError: Class constructor EventEmitter_ cannot be invoked without 'new'
at new ZoneAwareEventEmitter (node_modules/@progress/kendo-angular-grid/dist/npm/common/event-emitter.js:16:28)
at new GridComponent (node_modules/@progress/kendo-angular-grid/dist/npm/grid.compone
浏览 6提问于2022-03-21得票数 4
1回答
由于某些原因，滚动在这个ListView上根本不起作用，我真的不知道为什么。项目显示正确，只是列表不可滚动。使用网格是不可行的(据我所知)，因为设置为显示的项是从web源中提取的(不知道会有多少，也不太愿意使用hacky方法获得可滚动列表)。
<Page
x:Class="Hello_World.News_Feed"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/w
浏览 4提问于2021-10-04得票数 0
回答已采纳
我有一个项目，在那里我使用Angular Kendo UI网格，并希望能够将数据导出到excel文档。我看过ng-grid csv导出，但似乎需要使用put in a plugins选项，但是Angular Kendo UI Grid没有这个选项。有人能给我指个方向吗？
谢谢
浏览 4提问于2014-05-01得票数 1
2回答
我已经创建了一个WPF应用程序，它在第二行网格中生成瓷砖。我试图实现的是在第二行不显示垂直滚动条的情况下，直到WPF应用程序的高度超过用户屏幕的分辨率。
<Window x:Class="ABC.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="ABC Installation
浏览 0提问于2016-02-08得票数 0
回答已采纳
我的项目是使用AngularJS +Kendo。我正试图将Karma融入到现有的项目中。我可以测试指令，并在测试中呈现我构建的组件。但是，当我试图加载剑道网格时，它永远不会被渲染。
我的业力配置：
module.exports = function (config) {
config.set({
basePath: '../',
autoWatch: true,
singleRun: false,
frameworks: ['jasmine'],
browsers: [
浏览 4提问于2014-07-31得票数 1
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
对象存储
云直播活动推荐
腾讯云开发者
