0

I am generating checkboxes inside an *ngFor using Angular 6 Material 6. The checkboxes are displayed properly. But when I click on any one of the checkboxes, they are flickering and not able to be checked properly.

I tried it in stackblitz, where it is working properly. I don't know if anything I have missed. I am struggling from past one week.

I have imported it properly in app.module.ts like this:

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

This is my code. Please suggest me any dependencies other than this I need to include.

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

Please Guide me.

kboul
  • 13,836
  • 5
  • 42
  • 53
Darshan theerth
  • 516
  • 1
  • 13
  • 34

1 Answers1

0

i have used your code it's working properly and i added the below so go through these steps you have included or not may be it's helpful for you.

Step 1: app.module.ts

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

 imports: [MatCheckboxModule],

Step 2: styles.css

import all below css files.

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

Step 3: Your code 

 <div *ngFor="let prop of reflectUI; let i = index">
    <mat-checkbox>prop</mat-checkbox>
</div>
Vijayakumar Mural
  • 104
  • 1
  • 6