57 lines
2.1 KiB
HTML
57 lines
2.1 KiB
HTML
<table mat-table [dataSource]="users">
|
|
@for (column of columnsSchema; track column){
|
|
<ng-container [matColumnDef]="column.key">
|
|
<th mat-header-cell *matHeaderCellDef>
|
|
{{column.label}}
|
|
</th>
|
|
<td mat-cell *matCellDef="let element">
|
|
@switch (column.type) {
|
|
@case ('list') {
|
|
<mat-form-field class="example-chip-list">
|
|
<mat-chip-grid #chipGrid aria-label="Role selection">
|
|
@for (role of element.roles; track $index) {
|
|
<mat-chip-row (removed)="remove(role,element)">
|
|
{{role.name}}
|
|
|
|
<mat-icon
|
|
matChipRemove
|
|
[attr.aria-label]="'remove ' + role.name"
|
|
>
|
|
cancel
|
|
</mat-icon>
|
|
|
|
</mat-chip-row>
|
|
}
|
|
</mat-chip-grid>
|
|
<input
|
|
name="currentRole"
|
|
placeholder="Add role..."
|
|
[matChipInputFor]="chipGrid"
|
|
[matAutocomplete]="auto"
|
|
[matChipInputSeparatorKeyCodes]="separatorKeysCodes"
|
|
[formControl]="rolesControl"
|
|
[matChipInputAddOnBlur]="true"
|
|
(matChipInputTokenEnd)="add($event,element)"
|
|
(input)="change($event,filteredRoles(element.roles))"
|
|
/>
|
|
<mat-autocomplete [formControl]="ac"
|
|
autoActiveFirstOption
|
|
#auto
|
|
(optionSelected)="selected(element,$event); ">
|
|
@for (role of filteredRoles(element.roles); track role) {
|
|
<mat-option [value]="role">{{role.name}}</mat-option>
|
|
}
|
|
</mat-autocomplete>
|
|
</mat-form-field>
|
|
}
|
|
@default {
|
|
{{ element[column.key] }}
|
|
}
|
|
}
|
|
</td>
|
|
</ng-container>
|
|
}
|
|
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
|
|
<tr mat-row *matRowDef="let row; columns: displayedColumns"></tr>
|
|
</table>
|