estoy usando Angular 7 con Ngx-Admin. Tengo una pagina donde cargo un select (nb-select para ngx-admin) con valores obtenidos de la db. Al select le agregué dos botones, TODOS y Ninguno, para seleccionar todos o deseleccionar todos. El inconveniente que estoy teniendo es en el onSelectAll, dado que cuando ejecuto este método, no se actualiza lo que veo en el html. Si ejecuto el onDeselectAll, si se actualiza. Este es mi código html:
<nb-select class="col-sm-10" multiple [(ngModel)]="states">
<nb-option>
<button (click)="onSelectAll()">TODOS</button>
<button (click)="onDeselectAll()">Ninguno</button>
</nb-option>
<nb-option [value]="i.id" *ngFor="let i of stateslst">{{i.name}}</nb-option>
</nb-select>
Ya en component.ts, en el método ngOnInit, al momento de cargar los datos en el select tengo lo siguiente (esto funciona perfectamente):
stateslst: any[];
states: any[] = [];
ngOnInit() {
const sl = JSON.parse(localStorage.getItem('filterStates'));
this.serviceCatalog.getAllStates().subscribe(data => {
this.stateslst = data['body'];
if (sl) {
this.states = sl;
} else {
this.states = this.authGuard.user['states'];
localStorage.setItem('filterStates', JSON.stringify(this.states));
}
this.datasource = new ManagementsDataSource(this.manService);
this.datasource.loadManagements(this.authGuard.user['sub'], 0, this.itemsPage, '', this.states, null, null);
this.isLoaded = true;
});
}
Y luego tengo los 2 metodos para seleccionar todo y deseleccionar que son los que no funcionan. El método onSelectAll, al ejecutarse no se actualizan los datos en el html. Si pongo un console.log() para ver el contenido de this.authGuard.user['states'], me muestra que contiene los datos correctamente (estos datos son [1,2,3,4,5,6,7,8,9 etc]), pero en la vista no estan seleccionados:
onSelectAll() {
this.states = this.authGuard.user['states'];
}
onDeselectAll() {
this.states = [];
}
Seguramente algo me falta o algo está mal, dado que estoy empezando recien con angular. Gracias a todos los que puedan leerlo y darme una mano