问题标签 [mat-table]

我有一个路径列表，其中可以包含通配符。过滤/突出显示与包含通配符的路径匹配的路径的最佳方法是什么？因此，当您还拥有路径“/server/*”f.ex 时，将标记路径“/server/test/block”。到目前为止，我已经尝试将 .filter 与 .contains 嵌套，并检查数组是否大于 1。但是，这只会给出完全匹配，而且我没有找到将相同类添加到彼此匹配的类的好方法.

为了运行该函数，我在我的 mat-cell 上测试了 [innerHTML]-selector，但该函数运行了很多次。我还在 mat-cell 内的跨度上使用 [class.someName]-selector 进行了测试，但这也会多次调用该函数。任何关于我应该寻找的方向的指针将不胜感激。

数据使用材料表显示。

Angular 7 带来了强大的功能DragDropModule：https ://material.angular.io/cdk/drag-drop/examples

该文档处理重新排列列表中的项目或在多个列表之间传输项目。但是，它没有谈论表格。

我想知道是否有一种舒适的方法可以使用 angular material 的拖放系统对 mat-table 或 cdk-table 中的行进行重新排序。

（您可以添加cdkDropList使mat-table机制工作但没有所有花哨的动画和默认拖动占位符的内容。）

是否存在类似于通过拖放对表格行进行排序的易于实现的默认设置？

我有一个数据源，其中包含分组的数据。例如父级： - 名称 - 字符串 - 段 - 段对象的数组列表（每个段对象都有标题和描述

我正在尝试使用 mat-table 在行和列中显示数据，如下所示：

当我单击段标题时，我想在段组中使用 mat-sort 和排序（即在对段进行排序后，排序后的数据应如下所示）：

当我单击名称（标题）时，表格应按如下方式排序：

我该怎么做？有没有一种以上述格式对我​​的行进行分组的好方法。（现在我在 mat 单元格中使用 div 来显示看起来不正确的内容）。我尝试使用类似于此链接的显示方法 但是，当我将 mat-sort 添加到该组标题时，会在顶部进行排序，并且行在下面。

此链接 具有以所需方式显示数据的示例

我有这张表用于多个数据。

我的问题是数据显示正确，但分页器和排序不起作用。

排序只显示箭头，但不会排序

Paginator 不会计算项目并将显示“0 of 0”

这是我的代码：component.html

我加载数据的代码是：component.ts

关于如何使分页器和排序工作的任何想法？

我无法显示我的表索引。这是一个示例表：

列索引i并按j预期显示，但是当我单击我的行时，索引k显示为未定义。我在这里做错了什么？

我有一个使用排序和分页的垫表。我有一个要求，每次对数据进行排序时，我都需要获取排序的数据。我在这里有一个例子：Mat-table with pagination

在 component.ts 我有以下行来获取排序的数据：

this.dataSource.connect().subscribe(d => this.renderedData = d);inngOnInit但它只获取 mat-paginator 中选定的行数。我想获取所有数据。有什么好的方法可以得到这个吗？

对象显示在renderedData页面顶部。谢谢

当没有表数据时，我尝试使用下面的 stackblitz 链接显示“未找到记录”消息，但是当我使用MatTableDataSource类型的数据源时出现问题。

stackblitz 链接： https ://stackblitz.com/edit/angular-w9ckf8

以下是我正在使用的代码片段：

对应的html：

以下是我得到的错误：

错误类型错误：无法读取未定义的属性“长度”

我想mat-table在 Angular 中添加一个删除按钮或 Angular 垃圾图标。我怎样才能实现它？我的工作台代码：

我有一个由这种垂直结构组成的应用程序：导航栏、搜索部分和带有结果的表格。这些树元素中的每一个都占用了它所需的空间，而不使用固定大小。搜索部分的更多部分具有隐藏的子部分，因此它的大小会随着时间而变化。

我想做的是：我希望这三个部分独立调整它们的高度以占据所有可用空间。但是由于我可以在表格上显示很多结果，因此最终需要一个垂直滚动条。所以我想看到的唯一滚动条是在表格的结果部分。

如果我设置

溢出：自动

如果表格有太多结果，我会在全局 CSS 上看到一个全局滚动条。

如何强制表格使用屏幕上的剩余空间并在需要时显示滚动条？

我需要对角分割 Mat Table 单元格。并需要根据值添加值和颜色。像这样...

现在我将单元格分成四个。并添加值和颜色...

这是我的代码 .html

.css