J'ai cherché partout. Ce que j'ai obtenu des autres réponses est que Je dois utiliser [selected]
si je veux sélectionner une option particulière.
Cela ne semble pas fonctionner. Pourquoi? Voici ce que j'ai:
<ngx-datatable-column name="status" prop="operationStatus" [flexGrow]="1"> <ng-template let-value="value2" let-row="row" let-rowIndex="rowIndex" gx-datatable-cell-template> <select class="geraeteStatus" [(ngModel)]="selectableGerateStatus"> <option *ngFor="let e of selectableGerateStatus" [ngValue]="e" [selected]="e.id === value2"> {{e.id}} </option> </select> </ng-template> </ngx-datatable-column>
Je suis sûr que la valeur de e.id
est égale à celle de value2
à au moins une fois par itération. Cependant, cela ne fonctionne tout simplement pas.
En fait, je peux mettre tout ce que je veux (e.id === 2, ou même «vrai») dans [selected]
cela n'a aucun effet.
Je n'ai aucune idée de ce qui me manque. Toute réponse est très appréciée.
3 Réponses :
Il n’est pas nécessaire d’utiliser [selected
dans vos options
il suffit de faire quelques changements comme ci-dessous
selectedStatus: string; onChange(status: string) { this.selectedStatus = status; }
mais ici vous devez faire correspondre ngValue
avec votre ngModel
alors seulement il le fera être sélectionné.
<select class="geraeteStatus" (change)="onChange($event)" [(ngModel)]="selectedStatus"> <option *ngFor="let e of selectableGerateStatus" [ngValue]="e.id"> {{e.id}} </option> </select>
Pour plus d'informations sur les options de sélection cliquez ici
merci gnaesh045. Malheureusement, cela ne fonctionne toujours pas.
Liez l'option avec une valeur au lieu de ngValue comme ci-dessous.
<select class="my-status" [(ngModel)]="myModel.status"> <option [ngValue]="null" selected disabled> Select Status </option> <option *ngFor="let e of selectableGerateStatus" [value]="e"> {{e.id}} </option> </select>
Je présente comment j'ai résolu le problème. Notez que je suis assez nouveau en angular, et mon approche pourrait être rudimentaire. Je tiens également à rendre hommage à @Eliseo qui a souligné le fait que ngModel et selected ne doivent pas être utilisés ensemble . C'est pourquoi je me suis débarrassé de l'ancien et utilisé uniquement sélectionné:
component.html
this.selectableGerateStatus = [ { id: 0, label: BaseDataComponent.NEW }, { id: 1, label: BaseDataComponent.ACTIVE }, { id: 2, label: BaseDataComponent.DEINSTALLED } ]
et le fichier .ts:
<select class="geraeteStatus" (change)="changeGaerateStatus($event, rowIndex)"> <option *ngFor="let e of selectableGerateStatus" [selected]="value == e.id"> {{e.label}} </option> </select>
si vous utilisez [(ngModel)], vous ne devez PAS utiliser [selected]. Le problème est que vous utilisez [ngValue] = "e". Ainsi, la variable "selectableGenerateStatus", est un objet - vous avez vraiment besoin que ce soit le même objet. Utilisez [ngValue] = "e.id" pour travailler
OK j'ai compris. J'ai supprimé "sélectionné". J'ai changé pour ce qui suit: . Mais cela ne fonctionne toujours pas