问题标签 [angular-cdk]

我围绕画布（konva）库构建了一个编辑器 UI，并希望实现以下目标：

在左侧，我想显示代表不同工具（角度材料垫列表）的图标列表，这些图标可以根据编辑器的模式动态更改。现在，如果用户激活这些工具，则该工具的选项应该在右侧的其他地方可见。

经过一段时间的学习，我了解到 CDK Portals+Portal-Hosts 可以解决这个问题（参见https://blog.angularindepth.com/angular-cdk-portals-b02f66dd020c），但在他的工具选项示例中，他使用非 ng-template 部分来显示图标本身。我不希望工具组件本身定义格式以单独显示其图标。相反，我想将一些像 '{ icon: 'some_icon', component: ToolXZYComponentClass }' 传递给图标列表组件。但话说回来，有没有比完全或以这种方式使用 CDK 门户更好的方法来实现这一点？

我正在尝试通过触发cdkConnectedOverlayfrom acdkOverlayOrigin作为非常轻量级的解决方案来使用 Angular CDK 的覆盖，以添加仅模板覆盖。这很好用。

但是，如果我尝试通过更改连接的叠加层绑定到的叠加层原点来重复使用相同cdkConnectedOverlay的内容，则叠加层不会重新定位。cdkOverlayOrigin

我在这里设置了一个最小的例子：https ://stackblitz.com/edit/angular-9vet83?file=app%2Fapp.component.html

单击一个按钮会将cdkOverlayOrigin覆盖层的 设置为被单击的按钮。

单击任一按钮，第一次正确定位叠加层。然而，无论之后单击哪个按钮（即覆盖原点），覆盖的位置都保持不变。

我是不是做错了什么，或者这可能是 Angular CDK 覆盖中的一个错误，cdkOverlayOrigin没有应用更改？

我正在尝试在我的 angular 2 应用程序中使用分页器组件实现一个表格。

我成功地能够使用角度 2 中的表格组件创建表格。但是我使用下面的导入语句完成了它。

“从'@angular/cdk/collections'导入{DataSource}；”

下面显示的是我的 home.component.ts

下面显示的是我的 home.component.html

使用上面的代码，我在我的 cli 中收到以下错误

“D:/Angular/loginmat/src/app/home/home.component.ts (20,21)：‘eDataSource’类型上不存在属性‘paginator’。”

任何人都可以指导我，以便我在我的桌子上实施分页器时缺少什么？

我正在尝试使用UMD模块定义文件在ES5中使用Material the old school。

一切正常，直到我决定升级到版本 5。现在它说它找不到bidiundefined 并且当我调查这个问题时，我意识到这是因为新的CDK或Component Development Kit。

现在我在一个地方找不到包含其所有部分的软件包 CDK UMD 文件，我真的不想将所有这些 a11y、i18n、bidi 等一一包括在内。

问题是，我查看 CDK 文件的次数越多，我就越意识到我什至可能根本不想要它们。没有他们我会很好。

有没有办法不加载它们并仍然使用材料？

我正在使用垫表。它有一个过滤器，适用于文档示例：

从https://material.angular.io/components/table/overview，原始代码是：

使用此实现，在过滤时，它会过滤任何列。

现在我正在尝试更改过滤器，因为我想要仅针对“名称”列进行过滤，因此我正在尝试重写过滤器并分配给 filterData。

在控制台中，我可以看到 this.dataSource.filteredData 有我要打印的数据，但表没有重新加载。

我缺少什么？

我正在使用 Angular CDK 表（没有 Angular Material2）并且想使用引导表设计来设置它的样式。

可以向 CDK 表添加类，但引导规则直接处理 html 表元素tr, td, ... 并且 Angular CDK 使用自定义标签cdk-table, cdk-row, cdk-cell...

作为快速而肮脏的解决方案，我为 cdk 元素编写了自己的规则，其中包含大量来自引导源的复制粘贴。但是，是否有一个很好的、也许更面向未来的解决方案来自动继承 CDK 表的引导规则？

我的 mat-table 工作正常，但是在按照官方 api 文档添加 mat-sort 时，它在 ngAfterViewInit 失败并显示以下消息

无法在 ViewFeedbackComponent.ngAfterViewInit 处设置未定义的属性“排序”

已经有一个关于这个问题的帖子（见下面的链接）Mat-table Sorting Demo not working，但我仍然无法让它工作。

有人发现问题了吗？官方示例使用组件本身中定义的“静态”MatTableDataSource，但是我从后端查询。

任何帮助是极大的赞赏！

MatSortModule 已经在 app.module.ts 中导入，mat-sort-header 指令应用于列，并且 ngAfterViewInit 已经与官方示例中的完全一样......

我正在研究 mat-button-toggle-group，我通过覆盖 mat-button-toggle-checked 类来修改现有的 css，如下所示。现在，当我在按钮之间切换时，css 在我获得焦点之前无法工作，那是因为当单击的按钮处于焦点时添加了 2 个 cdk 类 'cdk-focused' 和 'cdk-program-focused' 。有什么方法可以使这些类禁用或使它们不应用或用相同的 mat-button-toggle-checked 覆盖它们？

和CSS

我正在使用一项服务来使用组件门户实例化 Angular Material CDK 叠加层。

创建门户并将其附加到叠加层后，是否有任何方法可以访问门户创建的组件的组件引用？我希望能够从外部收听该组件的事件。例如：

我已经搜索了文档和源代码，找不到解决方法。我可能不得不求助于将服务中的回调注入到非常混乱的组件中。

有谁知道如何做到这一点？

我有角度材料数据源。角材料版本是 ^5.0.3 排序工作。但是，对于某些列，它的排序不正确。数字和文本在那里。例如，排序后的结果像，'XXX'，'1'，'1tesxt'，'1'，'OPD'，OXD'，'12'。

感谢你的帮助。