デフォルト - 選択したドロップダウンリストの角マークオプション

Question

正しいオプションを自動設定する際に問題が発生しました。selectedです。 I 容疑者理由は、角度が理解できないためにprice.currencyとlet currency of currenciesが同じオブジェクトである可能性があります。

<select [(ngModel)]="price.currency" class="form-control"> 
    <option *ngFor="let currency of currencies" [ngValue]="currency"> 
     {{currency.iso_code}} 
    </option> 
</select> 

あなたがここに見ることができるように私は両方のpriceためとcurrencyのためのモデルクラスを作成しました：

export class ProductPrice { 
    id: number; 
    product: number; 
    price: number; 
    taxrule: Taxrule; 
    currency: Currency; 
} 

私はcurrenciesのリストを取得する場合、私はCurrency[]のリストにそれをキャスト。

最後に、[selected]="price.currency.id == currency.id"引数を<option>に追加してみましたが、何も結果がありませんでした。おそらくngValueがそれを無効にするからです。

アイデア？

Answer 1

price.currencyはcurrenciesアレイから認識できません。これらの2つの値をバインドするには、これら2つの値の間に参照を作成します。あなたは通貨（とprice）を受け取った後それはこのように、たとえば、行うことができます。

this.price.currency = this.currencies.find(x => x.id == this.price.currency.id) 

は、ここで私が探していたDemo