Filter table data based on mat-tree checkbox selection, in angular 6

1.4k Views Asked by At

I have group checkbox which is having parent and children. I am using the following slackblitz example to achieve that: https://stackblitz.com/angular/nkmjydodvnp?file=app%2Ftree-checklist-example.ts

In the same page I have a table where : am showing my JSON response.

 "data": [
          {
            "reminderName": "Cook dinner",
            "status": "some value",
          },
          {
            "reminderName": "Read the Material Design spec",
             "status": "some value1",

          },
           {
            "reminderName": "Cook dinner",
            "status": "some value3",
          },
         {
            "reminderName": "Read the Material Design spec",
             "status": "some value4",

          }
]

And in table I am showing this response like this:

 <tbody>
          <tr *ngFor="let data of data>
            <td>{{data.reminderName}}</td>
            <td>{{data.status}}</td>
          </tr>
</tbody>

So here I want to refresh the table based on checkbox selection:

enter image description here

If I will select Cook dinner, only Cook dinner rows will show in table. Same with Read the Material Design spec also. If I will not select anything, then all data will show.

I have searched a lot on this, but not able get anything. I am struggling with this. Can anyone please help me to resolve this?

0

There are 0 best solutions below