I have a mat-selection-list
with several options, I want that when selecting an option all the other options disappear and when deselecting the option, all the other options reappear.
If there is another better way to do it, I would like to know.
I have tried to place a ngIf
in which if nothing is selected, everything appears, and if there is something selected, only the selected option is kept.
<mat-selection-list #flightsList [(ngModel)]="selectedFlight" (ngModelChange)="onFlightSelection($event)">
<h3 mat-subheader>Selecciona el vuelo</h3>
<ng-container *ngFor="let flight of flights">
<mat-list-option [value]='flight' #option *ngIf="selectedFlight.length == 0 || option.selected">
{{ flight.name }}
</mat-list-option>
</ng-container>
</mat-selection-list>
The selection does not work and it gives me a console error
The error is "undefined option", I suppose it is because at the moment of disappearing, there is no #option