How to check the matrix of inputs

My business requirements are very close to the image below. Let's say I had a group of students and a group of materials, and any student is associated with at least two materials. and lets say that I want to create a UI for registering a student class on a specific date:

Now the true sign means the student is related to the material, and the X sign means the opposite. and in real UI, the square of the label is actually an input element that should be disabled if the student is not visible (assigned) to the given material.

I used angular material 5.2.4 mesh to draw the matrix and to do this I received all the materials ordered by Id and all students and their materials and ordered student materials by Id. I then updated the student material arrays to have an empty object instead of each unassigned material.

html code:

<mat-grid-list *ngIf="length" [cols]="length" rowHeight="2:1" >
          <mat-grid-tile></mat-grid-tile>
          <mat-grid-tile *ngFor="let material of materials ">{{material .name}}</mat-grid-tile>
          <ng-container *ngFor="let student of students">
            <mat-grid-tile>{{student.name}}</mat-grid-tile>
            <mat-grid-tile *ngFor="let stu_material of student.materials">
                 <mat-form-field>
                    <input matInput  type="number"   [disabled]="stu_material.id == null ? true :null" >
                 </mat-form-field>


            </mat-grid-tile>
          </ng-container>
        </mat-grid-list>

      

        
        
        
      

    

I got what I wanted from this code, but how can I validate student input elements? I have read about Form Arrays but I cannot display my case correctly. especially with these requirements.

Any help is greatly appreciated.