Select,Unselect,Intermediate Checkbox treeview in *ngFor

Question

As I mentioned above code i want category is my parent and when I'm select category checkbox it will select all it's child checkbox(items) .And when I select particular one child then category checkbox is intermediate. Same for the child and subchild is sizes.

Any solution for that?

 <ul>
        <li *ngFor="let category of menuitem">
            <span><input type="checkbox 
                   (change)="OnCheckboxSelect(category,$event)">
            </span>
            <span><a href="#{{category._id}}" data-toggle="collapse" > 
                   {{category.category_name}}</a>
            </span>
              <ul id="{{category._id}}" class="collapse">
                 <li *ngFor="let item of category?.category_item">
                    <span><input type="checkbox"   
                          (change)="OnItemSelect(item, $event)"> 
                    </span>
                     <span><a href="#{{item._id}}" data-toggle="collapse"> 
                           {{item.item_name}}</a>
                     </span>
                          <ul id="{{item._id}}" class="collapse">
                             <li *ngFor="let size of item?.item_size">
                                <span><input type="checkbox" name="">
                                </span>
                                <span>{{size.size_name}}
                                </span>
                              </li>
                           </ul>
                    </li>
                </ul>
          </li>
  </ul>