问题标签 [angular-material-table]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
11381 浏览

angular - 如何在角度 5 中使用 MatTableDataSource 创建自定义过滤?

在 Angular Material 官网Angular Material Table中提到 filterPredicate: ((data: T, filter: string) => boolean) 将根据特定字段过滤数据。但不知道如何开始。有没有这方面的例子。

0 投票
1 回答
1499 浏览

angular - 数据源更新时保持展开的 mat-table 不会折叠行(Angular Material)

我正在构建一个应用程序,它使用应该每隔几秒钟更新一次的实时数据。我正在使用 mat-table,它在可折叠行内显示一个附加的 mat-table。崩溃工作正常,但是当我更新数据源时它崩溃了。有什么方法可以防止/覆盖这种行为?我编辑了折叠示例以说明我的意思:https ://stackblitz.com/edit/angular-3yukjz - 只需按下第一个元素,它会随着数据源的更改而折叠。

0 投票
5 回答
13280 浏览

angular - 在材质表页脚中包含按钮和分页器

我使用 Angular Material Table,我需要一个命令按钮和表格页脚行中的表格分页器,像这样 在此处输入图像描述

我的代码实际上是这样的

如您所见,我将<mat-paginator>元素移到了td...但是这破坏了分页器,因为它不再对表格进行分页...(您会看到“ 0 of 0”并禁用分页按钮)...当我放它回到table元素之外,分页器恢复正常......

如何正确地将分页器放在页脚行内?

0 投票
1 回答
1396 浏览

angular-material - 如何使用 matSort 对 mat-table 中的列进行排序?

我正在尝试在 mat-table 中实现排序,但它根本不起作用。我没有收到任何错误。

这是我的代码。

这是我的 component.ts 文件

终端,即 mat-table 的数据源,是嵌套对象的数组。serialKey 是一个字符串。

这是我的 component.html 文件的代码片段。我已将 mat-sort-header 添加到 serialKey 列。

如果有人能告诉我我在这里缺少什么来对表格进行排序,那就太好了。

0 投票
1 回答
802 浏览

angular - 在渲染 Angular Material 表时访问下一行

我想像滚动总重量一样显示 {{element.weight} + element of previous row.weight}。语法是什么?工作样本源取自 这里

0 投票
1 回答
33 浏览

css - Angular Material在没有CSS Flex的情况下对齐单元格内容?无论如何,Flex都会在行上水平错误对齐单元格

在我的表格中有一个带有按钮的列,因为它看起来非常不对齐,所以我决定将标题对齐到中间的那一列 - 没问题。现在我正在尝试对齐列的其余部分。

问题是,使用 CSS Flex 可以工作,但单元格水平方向完全错位,如下所示:链接。

对齐列单元格的代码很简单:

我已经尝试了所有其他对齐方式,但它根本不起作用。

也通过 angular flex 布局尝试过,但最终只是作为 CSS Flex 结束。

0 投票
1 回答
2998 浏览

html - 角度材料 2 表 - 使用 TemplateRef 和 ngTemplateOutlet 定义列

我正在尝试制作可重复使用的材料表,并且我想使用TemplateRefwithngTemplateOutlet来生成列。在示例中,我创建了cards正在使用我的组件的material-table组件。在cards.component.html我有我的表格列之一的模板。运行项目将导致错误ERROR TypeError: Cannot read property 'template' of undefined(参见控制台stackblitz)。是否可以将 columnt 模板传递给我MaterialTableComponent并使用它来定义列?

更新 我找到了使用ngTemplateOutletContext.

看我的例子

0 投票
2 回答
6943 浏览

angular-material - 如何在角度材料表的垫表列中添加子列

我正在尝试使用 Angular Material Table (如链接)创建一个带有子列的垫表。有没有办法用角材料表做到这一点?我可以从其中一列创建子列吗?请从以下链接查看表格

https://datatables.net/examples/basic_init/complex_header.html

0 投票
1 回答
458 浏览

angular - 以角度对嵌套数组对象进行排序

我有这个 json 附加到一个垫表

我正在使用以下代码对列进行排序

}

除了附加到角色访问的列之外,排序似乎对所有列都有效。我还可以根据 requestReason 和角色进行排序。此时排序似乎没有发生。

0 投票
5 回答
34262 浏览

javascript - 角材料表单元格格式

我正在使用角度材料表来显示数据并动态绑定表头和表数据。有没有办法动态格式化特定列的单元格内容?

例如,我如何格式化金额列的值右对齐?

我的代码如下:

我的数据就像