*ngFor 中的 mat-checkbox 在材料 6 中无法正常工作答案

【问题标题】：mat-checkbox inside *ngFor is not working properly in material 6*ngFor 中的 mat-checkbox 在材料 6 中无法正常工作
【发布时间】：2018-07-25 20:13:27
【问题描述】：

我正在使用 Angular 6 Material 6 在 *ngFor 中生成复选框。复选框显示正确。但是当我单击任何一个复选框时，它们会闪烁并且无法正确检查。

我在 stackblitz 中尝试过，它工作正常。我不知道我是否错过了什么。过去一周我一直在苦苦挣扎。

我已经像这样在 app.module.ts 中正确导入了它：

import {MatCheckboxModule} from '@angular/material/checkbox';

这是我的代码。请建议我除此之外的任何依赖项。

<div *ngFor="let prop of reflectUI; let i = index">
    <mat-checkbox>prop</mat-checkbox>
</div>

请指导我。

【问题讨论】：

标签： angular checkbox angular-material-6

【解决方案1】：

我已经使用了您的代码，它工作正常，我添加了以下内容，因此请完成您包含的这些步骤，或者可能对您有帮助。

第 1 步：app.module.ts

import {MatCheckboxModule} from '@angular/material';

 imports: [MatCheckboxModule],

第 2 步：styles.css

导入以下所有 css 文件。

@import '~@angular/material/prebuilt-themes/deeppurple-amber.css';
@import "~material-design-icons/iconfont/material-icons.css";
@import '~@angular/material/theming';

第 3 步：您的代码

	<div *ngFor="let prop of reflectUI; let i = index">
    <mat-checkbox>prop</mat-checkbox>
</div>

【讨论】：