问题标签 [mat-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 回答
1187 浏览

angular - 角度材料表 - 排序方向未在屏幕阅读器中读取

我正在研究可访问性。我检查了 Angular 文档,它没有读取排序方向。这是链接

我做了一些研究,发现我们必须在下面做才能改变它。这是参考链接排序按钮的 aria-label 可以在 MatSortHeaderIntl 中设置。

我正在尝试设置此值,但失败并出现以下错误。有人可以帮我解决这个错误。这是示例代码



0 投票
1 回答
537 浏览

angular - 分别在列中搜索(Angular 7)

我想在表格的每一列上使用过滤器。目前我正在使用通用过滤器,但这不是正确的方法。

如何使用FormBuilder和 formControlName 分别过滤每一列?我找到了一个模块的例子FormControl

0 投票
1 回答
67 浏览

angular - 如何在选项卡标题上显示脏通知

我有一个包含 3 个标签页的页面。每个标签页都包含一个具有 CRUD 可能性的项目列表。

当用户更改了 tabcontent 中的任何项目时,我想在 tabheader 中显示脏通知。

我怎样才能做到这一点?

我的标签页创建如下:

例如,在 dko-bo-onderneming-detail-referenties 中,我监控数据何时发生变化:

因此,当我更改 isDirtyReferentiePersonen 属性时,我想更新选项卡标题“Referenties”以在我将属性设置为 true 时显示 *

我怎样才能做到这一点?

0 投票
1 回答
5211 浏览

angular - Angular 7将对象与对象数组映射到垫表

我正在尝试将我的一个对象映射到mat-table.

Web API 的输入对象如下

HTML 代码

角度模型:

角代码:

预期输出: dateReport 包含用作表中列名的日期。'n' 下面的结构表示 webapi 可能返回超过 2 个 ShoppingListDateModel 在这种情况下,应该为每个日期添加列

问题:

无法根据 dateRecord 生成列。UI 仅呈现前两列。

我是 Angular 的新手。如果我的执行错误,请告诉我,我可以根据输入进行修改。

0 投票
1 回答
3143 浏览

angular - 如何使用角度 6 根据 mat-table 中的条件仅显示几列?

我有一张有几列的垫子表。对于一种情况,我需要隐藏两列。对于普通表,我们将使用简单的 ngIf 条件。但是对于这个似乎不起作用的垫子表。我试过这个,

我的 HTML:

但它给出了 ERROR TypeError: Cannot read property 'diff' of undefined error。有人可以建议我如何在 mat-table 中做到这一点吗?

0 投票
0 回答
1158 浏览

angular - Angular 7 材质动态显示 mat-table 内的 mat-table 数据(第二行)

我正在尝试构建一个具有可扩展行的功能的垫表,其中可以在垫表的行内显示其他数据。我按照可扩展行的示例进行操作,但是,我希望辅助表始终设置为“扩展”。我可以显示辅助行,但表格没有正确显示,我相信这是因为我没有正确提取辅助数据。这是我的 HTML:

这里的目标是让第二行“subms”显示在每一行下方。但是,它应该只显示 subms 的 msparent === 到主行的里程碑 ID 或“element.milestoneid”的行。应隐藏所有其他行。有没有人对如何做到这一点有任何建议或有更好的解决方案的建议?

这是我的 CSS,主要取自 Angular 网站上给出的示例。

0 投票
4 回答
5670 浏览

angular - 如何获取 Mat-Table 的实例,如果我们在组件中有多个表

我遇到了一些问题。我在 Angular 6 中有一个组件,其中正在生成多个带有数据的 Mat-Tables。我在 div 标签中使用 ng-for 循环来遍历所有 Mat-Table 数据源。后来我试图在表中添加一个新行。到这里为止都很好,但是我无法获取单击此添加行功能的表的实例。在 .ts fenter 代码中,在 View-Child 的帮助下,我总是只获得第一个表的实例。我想获取所有表的实例,我将使用它调用渲染行函数来刷新视图中选定的 MatTable

粘贴视图和 TS 文件的示例代码。注意添加现在不起作用。

0 投票
1 回答
1974 浏览

angular - 按列值对 mat-table 进行排序

我有一张带有客户信息的垫子表。我想按列值对行进行排序。没有错误,但排序不起作用。

表标签有matSort

每个列定义具有mat-sort-header

在我有的组件类中

所以一切都非常像文档中的说明

如果您使用的MatTableDataSource是表的数据源,请将MatSort指令提供给数据源,它将自动监听排序更改并更改表呈现的数据顺序。

但是样式和排序功能都没有应用于表格。

这个问题不相关,因为即使我在课堂上硬编码的数据也存在问题。

我没有看到我错过了什么。问题的根源是在逃避我。您可以查看我的完整代码并在 Stackblitz 上运行示例

0 投票
2 回答
203 浏览

angular - 角材料表单元格:元素后

我不知道这是什么,或者更重要的是如何访问它。
我希望以前有人遇到过这个问题。

设想 :

我正在制作一个响应式表格,最后似乎有一个“幻影单元”

在此处输入图像描述

0 投票
1 回答
1379 浏览

angular - 单击表格列后将焦点设置在输入字段上(Angular 7)

我有一个问题,我需要关注我表中单击的列字段。我总是必须在字段上单击两次才能修改输入字段中的内容。

HTML:

零件:

我在其他线程中读到了一些关于template reference variable方法的内容,.focus()但它对我不起作用。

谁能帮我?