角4 ng代替＃

Question

私はあなたが通貨を選ぶことができ、選択された通貨に基づいているが、今はngifを使用して通貨を表示していますが、私はより多くのngifを追加する必要がありますし、そのページのHTMLコードは（100の異なる通貨= 100 ngif代）巨大になるだろうされているので私にはそれが論理的ではありません以上の通貨

は、これは私が今持っているものです。

会社.ts

currencyItems: string[] = ['MXN', 'PHP']; 
    currency: string = this.currencyItems[0]; 

company.html私が達成したいものを

<div class="col-md-5" *ngIf = "currency = 'MXN'"> 
     <input type="number" name="mxn" id="mxn" [(ngModel)]="newCompany.currency.mxn" class="form-control"> 
</div> 


<div class="col-md-5" *ngIf = "currency = 'PHP'"> 
     <input type="number" name="php" id="php" [(ngModel)]="newCompany.currency.php" class="form-control"> 
</div> 

は、私はコードのみ の一つのブロックにその

<div class="col-md-5"> 
     <input type="number" [(ngModel)]="newCompany.currency.<changes base on drop-down selection>" class="form-control"> 
</div> 

とも

へ

<td>{{company.currency.mxn}}</td> 

のようなものを持っているどのような方法があります

<td>{{company.currency.<changes base on drop-down selection>}}</td> 

I kn私はngSwitchを使うことができますが、それでもまだ多くのコードになるでしょう。

Answer 1

別個のプロパティをすべて使用してください。たとえば、selectedCurrencyです。次に、新しいオプションがselectedCurrency

<div class="col-md-5"> 
    <input type="number" [(ngModel)]="selectedCurrency" class="form-control"> 
</div> 

<td>{{selectedCurrency}}</td>