Angular 2 Wählen Sie ein komplexes Objekt mit Anfangswert

Question

In Angular (2.2) Ich versuche, eine select mit einem komplexen Objekt zu initialisieren. Aber da das Objekt keine tatsächliche Referenz auf etwas in der Liste select ist (obwohl es identisch ist), erkennt es es nicht als ausgewählt. Hier ist, was ich arbeite mit:

<select [(ngModel)]="model.object"> 
    <option *ngFor="let obj of objects" [ngValue]="obj">{{ obj.name }}</option> 
</select> 

Dies funktioniert wie vorgesehen, wenn Sie die Auswahl ändern. Aber beim ersten Laden, auch wenn model.object mit einem Objekt in der Liste identisch ist, wird nichts ausgewählt. Die zwei Problemumgehungen dafür sind (1) durch die Liste zu laufen und model.object zu tauschen, um eine direkte Referenz zu sein, aber das ist eine Zeile in einer Tabelle mit vielen Dingen wie dieser, das wird sehr teuer. Oder (2) binde [(ngModel)]="model.object.id" und [ngValue]="object.id" (ein einfacher Typ), aber ich möchte wirklich, dass das ganze Objekt im Modell dargestellt wird, also müsste ich immer noch an den Event-Handler binden und durch das Array von Elementen laufen, bis ich finde diese ID, und setze es selbst.

Ich hatte gehofft, es gab eine Möglichkeit, eine track by Art zu tun, so die erste Auswahl Tracks von ID.

In Angular 1, könnte dies erreicht werden durch:

<select ng-model="model.object" 
    ng-options="obj.id as obj.name for obj in objects"> 

aber ich kann kein Äquivalent zu finden scheinen.

Answer 1

Sie unten versuchen können,

@Component({ 
    selector: 'my-app', 
    template: `Angular 
    <select (change)="chnageProduct($event.currentTarget.value)" > 
    <option *ngFor="let obj of objects" [value]="obj" 
    [selected]="model.name === obj.name" 
    >{{ obj.name }}</option> 
</select> 
    ` 
}) 
export class AppComponent { 
    result: any = {}; 

    constructor(){ 
    } 

    model = {name : "1"} 


    objects = [{name : "1"},{name: "2"}] 

    chnageProduct(val){ 
    this.model = val; 
    } 
} 

Hier ist die Plunker !!

Hoffe das hilft !!