angular 4 ngI 대안

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>