问题标签 [angular-material-table]

从这篇 SO帖子中我了解到，为了处理大型数据集，您应该在 ngAfterViewInit 中的dataSource.data之前设置 dataSource.paginator。

但是，这样做时，我无法使用 this.paginator.pageIndex 设置初始 pageIndex。

https://stackblitz.com/edit/angular-mat-table-v2

当我在 ngOnInit 中加载数据并在 ngAfterViewInit 中加载分页器时，我可以设置初始 pageIndex：

https://stackblitz.com/edit/angular-mat-table-v1

在这里，我正在尝试在每行的角度材料可扩展表中使用一个操作按钮（编辑）。当我单击编辑按钮时，它不起作用，但行被扩展。

问题：-

1. 当点击编辑按钮应该在点击时工作并且行不应该被扩展。
2. 当单击没有编辑按钮的行的其他部分时，只会扩展行。

这是我的代码：

viewuser.component.html

viewuser.component.ts

这是角度材料参考.. https://stackblitz.com/angular/ygdrrokyvkv?file=app%2Ftable-expandable-rows-example.html

我正在使用带有相当大的预查询数据源的 Angular 材料表。现在，每次我使用内置的分页器更改表格页面时，我都会在新的表格行被渲染之前有一个短暂的延迟，同时我想显示一个加载微调器。

问题是，当 Table-Page 开始更改时，Paginator 只触发一个事件，到目前为止，我还没有找到解决方案来找出新行完全呈现时。（这将是我隐藏加载 Spinner 的时刻）

我知道服务器端分页会解决这个问题，但我更喜欢另一种可能性..

有人对我的问题提出建议吗？

我正在使用角度材料 8。我需要在一列中显示多个标题值，并在正文中显示其各自的值，并且我想在单击该标题值时根据特定标题值对数据表进行排序。我该怎么做？

这是我想要的数据表：

我想在数据表中显示多个值，如图所示，当我点击no.第一列中的属性时，数据表应该按照 排序no，当我点击name第一列时，数据表应该根据name.

我不想显示相同的数据，只想显示多个属性并将它们排序在一列中。

这是另一个图像。

如何将动态数据映射到角度材料表中的相应标题？我有按类别过滤数据的情况（在 parcelItems 下总是会有 2 个类别但未排序），如下所示。在这种情况下， Wears and Accessories是标题。Api 响应未在后端排序。我怎样才能做到这一点？

这是代码：stackblitz

样本

示例.json

我正在使用 Angular 的 Material Design Table 来动态呈现来自 API 的数据。该表能够呈现 OnInit，但是，任何更改 POST / DELETE 请求都不会在不刷新页面的情况下重新呈现表。除非我弄错了，否则我相信当从 observable 发出事件时，The Table 会自动呈现表格。关于 mat table 的一些评论是我之前通过谷歌搜索尝试过的。

编辑：在 alp 服务中添加了 createKiosk 功能

kiosk.service.ts

kiosk.model.ts

kiosk.component.html

kiosk.component.ts

我有 2 个角度模块：

• 学生
• 课程

在课程内部，我有一个组件 (CourseListComponent)，我想显示它嵌套在学生组件 (StudentDetailsComponent) 中。所以我需要从 Course 模块中导出该组件：

我还需要在 Student 中导入 Course 模块：

在 StudentListComponent 内部，我有一个带有 MatTableDataSource 的 MatTable，其中包含一些数据：

当我切换到 StudentDetailsComponent 时，我想显示学生注册的课程列表。我还想在 MatTable 中执行此操作：

但是当页面加载时，它只显示空表。我在控制台中没有错误，只是一个空表。

有谁知道如何解决这个问题？

谢谢！

这是HTML：

在课程列表组件中：

和模型：

我正在尝试在 mat-table 上实现 mat-sort，但是在尝试初始化 mat 排序功能时遇到了一些问题。排序属性未定义：

垫桌：

组件代码：

在 loadItems 我有这个：

正如您在顶部的屏幕截图中看到的那样，排序属性是未定义的。我是否需要编写一些额外的代码来初始化该属性？

我想创建可被任何组件使用的可重复使用的角度材料数据表，并且只需要传递所需的列标题和其他表数据。以下是我尝试过的：

我正在关注这个例子：stackblitz

在文件夹中创建shared文件src/app夹。和数据表组件也是可重用的。

数据表.component.html：

数据表.component.ts：

现在我app-data-table在我想要的地方使用选择器。我有配置文件组件，我想在其中使用它。

配置文件-setup.component.html：

配置文件-setup.component.ts：

配置文件-setup.module：

我怎样才能有条件地显示数据，有些数据表可能有“编辑”、“删除”按钮，有些没有这些按钮。任何帮助将不胜感激。

该项目在 Angular 8.3.19 上，我使用材料表，所有数据都从 Web 服务（单元格数据和列）动态获取。我创建了一个新的共享组件表，它实现了所有数据并动态创建每个表。问题是排序和分页不适用于自定义共享组件，但如果我在每个组件中创建每个表，则分页和排序工作正常。

下面你看到自定义共享组件表不起作用

src/app/shared/components/table/table.component.ts

src/app/shared/components/table/table.component.html

以及使用来自 Table 共享组件的所有数据动态创建表的组件

src/app/患者/组件/患者列表/患者列表.component.html

下面你会看到有效的代码

src/app/患者/组件/患者列表/患者列表.component.ts

src/app/患者/组件/患者列表/患者列表.component.html