Angular Material项目是Angular中Material Design的实现。该项目基于Material Design系统提供了一组可重用，经过良好测试和可访问的UI组件。不要将此标记用于AngularJS Material，即旧版AngularJS框架的Material Design实现。
CDK 虚拟滚动问题 maxBufferPx 未显示完整列表
我正在为一个大列表实现 CDK 虚拟滚动，虽然仅使用 minBufferPx 即可顺利滚动，但在添加 maxBufferPx 时遇到问题。如果没有它，我会收到此控制台错误： 呃...
单击任何菜单项时菜单会关闭，但要求是，如果单击项目菜单应打开
参考：https://material.angular.io/cdk/menu/examples Angular cdk 菜单在单击任何菜单项时关闭，但要求是，如果单击项目菜单应打开，并且应在单击我之外时关闭...
Angular Material - 如何在循环中对 mat-table 的数据进行排序
我正在循环内显示垫表。记录显示正确，并且还显示排序箭头。我使用过 MatSort 但它不起作用。谁能帮我看看我在哪里
如何限制用户打开后续的手风琴，直到当前手风琴中的表单在 Angular Material 中有效？
我有一个要求，我在扩展面板中有表单，并且只有在填写当前手风琴中的表单后，我需要允许用户导航到后续的手风琴。 例如，如果
如何在 Angular Material Design 中更改 Sidenav 的宽度？
无论我使用什么屏幕尺寸，Sidenav 始终是相同的尺寸。我尝试添加属性，例如 - 弯曲 - flex="85" （获取其容器的 85%） 似乎找不到好的方法。
如何将 matButton 设置为活动（聚焦）Angular？
当用户第一次和下次进入页面时，放置的按钮不会聚焦并以灰色突出显示。我尝试设置自动对焦： {{' 当用户第一次和下次进入页面时，放置的按钮不会聚焦并以灰色突出显示。我尝试设置自动对焦： <button mat-raised-button color="primary" autofocus>{{'recovery' | translate}}</button> 我认为这是 Material 按钮的缺陷。 如何在最后的 Angular 中设置聚焦材质按钮？ 您可以将焦点设置到组件生命周期钩子ngAfterViewInit处的按钮，例如： 模板 <button mat-raised-button color="primary" #btnRef="matButton">{{'recovery' | translate}}</button> Ts 文件 ... @ViewChild('btnRef') buttonRef: MatButton; ... ngAfterViewInit() { this.buttonRef.focus(); } ... 希望有帮助。 看起来有角材料已经有这方面的指令。检查Angular A11y <button mat-button cdkFocusInitial>Ok</button> <button mat-button #btnFocus=matButton [autofocus]="btnFocus.focus()">Post</button> 您可以使用MatButton的focus方法。 <button mat-raised-button #button>{{ 'recovery' | translate }}</button> @ViewChild('button') button; ngOnInit() { this.button.focus() } 添加一个简单的 autofocus 指令 autofocus 属性的问题在于它具有以下行为（请参阅 此处完整源代码，了解 MDN 上关于 autofocus 的更多信息）： autofocus 全局属性是一个布尔属性，指示元素应集中在页面加载时，或者当显示其所属的 <dialog> 时。 因此，如果您的按钮或输入元素稍后渲染，自动对焦将无法按预期工作。 您可以通过将现有属性包装在您自己的自定义指令中来轻松更改此行为，该指令在初始化时也将关注该元素。您只需要几行代码；我的看起来像这样并且运行良好： import { AfterViewInit, Directive, ElementRef } from '@angular/core'; // This directive makes autofocus work for form input elements that are rendered after initial page load @Directive({ selector: 'input', }) export class AutoFocusDirective implements AfterViewInit { constructor(public elementRef: ElementRef) { } public ngAfterViewInit(): void { if (this.elementRef.nativeElement.autofocus) { this.elementRef.nativeElement.focus(); } } } 注意： 确保全局加载此指令，或者确保每次您需要此自定义行为时不要忘记在模块中加载该指令，否则您会用头撞墙，想知道为什么它不这样做。不工作... <button mat-raised-button color="primary" #btn [autofocus]="btn.focus()">{{'recovery' | translate}}</button>
当列表项是组件时，Angular Material List 无法正确渲染列表
目标 我试图将格式化逻辑（而不是路由逻辑）封装到组件中。 我正在使用 Angular Material 的 MatList 组件。
如果有多个菜单元素，如何以编程方式打开特定菜单 - Angular cdk 菜单
如果有多个菜单元素，如何以编程方式打开特定菜单 - Angular cdk 菜单 正如下面给出的菜单 1 和菜单 2 的代码，我需要创建 @ViewChild(CdkMenuTrigger) 触发器：
当我修改 Material Angular 的 subscribe 块内的 books 变量时，视图没有更新dialogRef.afterClosed().subscribe()
在 books.component.ts 文件中 导出类 BooksComponent{ // 书籍变量 书籍：IBook[] = []； // 初始化 BookService 的构造函数 构造函数（私有 bookService：BookService）{} ...
我试图将分页放在页面的底部中心并使用 Angular Material mat-paginator 组件。 这是现在的结果： 1： 2： 正如你所看到的，垫子分页器现在已经运行了......
我正在开发一个项目，我在其中添加了一个轮播，但是当我应用 this.autoPlay() 时，页面会呈现在浏览器上，但只会继续加载，并且页面上没有任何可见内容，但是.. .
mat-dialog-content的孩子可以有高度：100%吗？
这是问题的演示：https://stackblitz.com/edit/stackblitz-starters-tdxfuc?file=src%2Fapp%2Fapp.component.ts 当 mat-dialog-content 内的内容太高时，我希望能够
我创建了一个角度库，我想在我的库 CSS 中使用应用程序的主要材质颜色。 应用程序可以定义主颜色，假设 $app-primary 在我的应用程序中定义...
我有一个垫子表，可以显示嵌套项目，例如树列表。我想添加拖放以将项目移入和移出节点/项目。 为此，我检查是否将鼠标悬停在一行的内部中心 75% 处。如果是这样的话...
升级到 Material 15（Angular）后修复基于 MDC 的组件的样式
Angular 项目升级到 Material 15 会导致样式问题，因为它们是基于 MDC 的组件。我试图了解将旧样式映射到新样式的最佳方法。这是……
我正在开发这个小应用程序，以根据下拉菜单的选择来显示数据。根据选择，应显示角度材料表。该表应该可以通过 MatSort 进行排序，l...
将“formFieldAppearance”属性应用于 Angular Material MDC Paginator
我有一个基于 Angular Material 的设计系统。我正在努力迁移到 MDC 组件。我现在使用 Paginator，无法弄清楚如何在 上设置 formFieldAppearance 我们
我想将 id 绑定到 Angular 材质复选框。 我有一个对象项目。 当我检查 html 时，我有 item.id + '-input' 但是当我绑定名称时就可以了：item.id 这是我的代码： 我想将 id 绑定到 Angular 材质复选框。 我有一个对象项目。 当我检查 html 时，我有 item.id + '-input' 但是当我绑定名称时就可以了：item.id 这是我的代码： <mat-checkbox [id]="item.id"[name]="item.id"> 我还没有使用过 Material，但在原生 Angular 中，你可以通过组件通过 [id]="{{item.id}}" 分配 ID。 如果您使用项目的对象数组 []，您还可以尝试迭代数组以创建多个条目，如下所示。 <div class="subbox text-center" *ngFor="let i of item"> <mat-checkbox [id]="{{i.id}}" [name]="{{i.name}}"> </div> 我假设您查看了底层的 input 元素。 Angular Material 复选框在内部将 -input 后缀添加到您的 ID，因为它必须确保 ID 是唯一的。如果将相同的 ID 应用于 input 和 mat-checkbox 元素，则该复选框不起作用，因为 ID 必须是唯一的才能将标签链接到它。
Angular mat-tab 延迟加载并在选项卡之间保留数据
我正在使用 Angular Material mat-tab，每个选项卡都有动态表单的内容。 我正在尝试使用延迟加载方法，以避免在开头加载所有选项卡内容，并且只加载...