angular-material-6 相关问题

Angular Material项目是Angular中Material Design的实现。它提供了一组基于Material Design系统的可重用，经过良好测试和可访问的UI组件。此标记适用于Angular 6的Angular Material的6.x版本。请勿将此标记用于其他版本或AngularJS Material，即旧版AngularJS框架的Material Design实现。

在外部点击时关闭 mat-sidenav

每当用户单击不在其中的某个位置时，我都会尝试关闭我的侧边栏。我已经尝试过双向数据绑定，现在我正在尝试使用 rxjs 的主题应用程序模板每当用户单击不在其中的某个位置时，我都会尝试关闭我的侧边栏。我已经尝试过双向数据绑定，现在我正在尝试使用 rxjs' Subject 应用程序模板 <app-sidenav [openedSubject]="openedSubject"></app-sidenav> 应用程序组件 openedSubject = new Subject<boolean>(); @HostListener('click', ['$event']) clickedInside($event) { this.openedSubject.next(false); } SidenavComponent @Input() openedSubject: Subject<boolean>; @ViewChild('sidenav') sidenav: MatSidenav; ngAfterContentInit() { this.openedSubject.subscribe(opened => { if(this.sidenav.opened) opened || this.sidenav.toggle(); }); } toggle() { this.openedSubject.next(!this.sidenav.opened); } Sidenav模板 <mat-sidenav-container> <mat-sidenav #sidenav><mat-toolbar color="primary">Menu</mat-toolbar> </mat-sidenav> <mat-sidenav-content> <mat-toolbar color="primary"> <button (click)="toggle()">toggle</button> </mat-toolbar> </mat-sidenav-content> </mat-sidenav-container> https://stackblitz.com/edit/ng-sidenav-experiments 但是好像有逻辑错误。 click 事件覆盖整个文档，但它应该排除侧边导航和工具栏。成功了。问题是我对 HostListener 的使用，而我真的只想像这样 (click) ： <sidenav [openedSubject]="openedSubject"></sidenav> <fake-route-view (click)="dismissSidebar()"></fake-route-view> 完整工作版本：https://stackblitz.com/edit/ng-sidenav-experiments

angular rxjs angular-material2 angular-components angular-material-6

回答 1 投票 0

Angular 材料：突出显示周末的日期选择器

我想在日期选择器上突出显示周末（周六和周日）。我尝试重新调整使用布尔值表示日期位置 0（星期日）和位置 6（星期六）的lockedweekendfilter...

css angular typescript angular6 angular-material-6

回答 2 投票 0

从 Angular 6 mat-selection-list 获取所选值的列表

如何获取从组件中的 Angular 材质垫选择列表中选择的所有值的列表。给出的示例显示了要在模板中显示但不在组件中显示的值。我正在尝试...

angular angular-material angular-material-6

回答 6 投票 0

垫子选择面板最小宽度

我正在尝试使用多个复选框自定义垫选择。由于某种原因，面板的最小宽度错误，如下所示：我不知道它在哪里计算这个最小宽度。我也尝试添加

angular-material angular5 angular-material2 angular-material-6

回答 7 投票 0

matTextareaAutosize 在 Angular Material 6.4.2 中不起作用

我正在尝试在 Angular Material 6.4.2 中的文本区域上应用自动调整大小，如下所示 - <question vote="4"> <p>我正在尝试在 Angular Material 6.4.2 中的文本区域上应用自动调整大小，如下所示 -</p> <pre><code><mat-form-field> <textarea matInput [matTextareaAutosize]="true" placeholder="Task description" formControlName="description" [errorStateMatcher]="ErrorMatcher"> </textarea> </mat-form-field> </code></pre> <p>但它抛出以下错误：无法绑定到“matTextareaAutosize”，因为它不是“textarea”的已知属性</p> <p>我的代码有什么问题？</p> </question> <answer tick="false" vote="2"> <p>在你里面<pre><code>app.moudle</code></pre></p> <pre><code>import { MatInputModule } from '@angular/material'; </code></pre> <p>然后将 <pre><code>MatInputModule</code></pre> 添加到您的 <pre><code>app.moudle</code></pre> 导入中 </p> </answer> <answer tick="false" vote="0"> <p>在 Angular v14 中，此属性已更改为 <pre><code>cdkTextareaAutosize</code></pre>。导入更改为</p> <pre><code>import {MatInputModule} from '@angular/material/input'; </code></pre> </answer> </body></html>

angular6 angular-material-6

回答 0 投票 0

mat-tab 删除 tab-body DOM 但不隐藏它

场景：我使用的是角度材料选项卡，每个不同的选项卡都有各自的动态组件。因此，当我切换选项卡时，它会从 DOM 中删除内容。当我再次回来时...

angular6 angular-material2 angular-material-6

回答 2 投票 0

mat-icon css颜色样式不适用。

作为一个刚接触Angular的新手，我有一个疑问，在Angular 4中，我们有一个来自MdIconModule的md-icon标签，在后来的Angular版本中，这个标签被改成了MatIconModule。

css angular-material angular9 angular-material-6 angular-material-7

回答 1 投票 0

角形材料一次扩展一行，并关闭所有其他打开的行

[嗨，我有一个带有扩展折叠选项的Mat表。我已完全使用以下链接作为参考。 https://stackblitz.com/edit/angular-material2-expandable-rows-filter-pagination-sorting现在...