* ngFor на объект angular2

Я получаю файл JSON из апи,* ngFor на объект angular2

, как вы можете видеть, есть объект внутри объекта называется «ставки» unfortantly * ngFor может ходить через только на массиве. Я ищу что-то, что я могу получить "ключ" и "Value" как

for(var var in obj)

, например, получить доступ к "AUD: 0,41852"

{ 
"base":"BRL",s 
"date":"2016-10-27", 
"rates":{ 
"AUD":0.41852, 
"BGN":0.57085, 
"CAD":0.42629, 
"CHF":0.31634, 
"CNY":2.1623, 
"CZK":7.8871, 
"DKK":2.1709, 
"GBP":0.26023, 
"HKD":2.4734, 
"HRK":2.1894, 
"HUF":90.257, 
"IDR":4156.5, 
"ILS":1.2256, 
"INR":21.311, 
"JPY":33.388, 
"KRW":364.6, 
"MXN":5.9721, 
"MYR":1.3381, 
"NOK":2.6227, 
"NZD":0.44646, 
"PHP":15.465, 
"PLN":1.2636, 
"RON":1.3146, 
"RUB":20.025, 
"SEK":2.8648, 
"SGD":0.44397, 
"THB":11.191, 
"TRY":0.98786, 
"USD":0.31893, 
"ZAR":4.4196, 
"EUR":0.29188 
}

}

здесь мой кодекс, объект курса должен быть в последнем «ионном элементе»

currency.html

<ion-header style="direction:rtl;"> 
    <ion-navbar> 
    <ion-title> 
     המרת מטבע 
    </ion-title> 
    </ion-navbar> 
</ion-header> 
<ion-content padding style="direction:rtl;"> 
    <ion-list> 
    <ion-item> 
     <ion-label>בחר מטבע:</ion-label> 
     <ion-select okText="אשר" cancelText="בטל" [(ngModel)]="selectCurrencyInput"> 
     <ion-option value="BGN">BGN</ion-option> 
     <ion-option value="BRL">BRL</ion-option> 
     <ion-option value="CAD">CAD</ion-option> 
     <ion-option value="CHF">CHF</ion-option> 
     <ion-option value="CNY">CNY</ion-option> 
     <ion-option value="CZK">CZK</ion-option> 
     <ion-option value="DKK">DKK</ion-option> 
     <ion-option value="GBP">GBP</ion-option> 
     <ion-option value="HKD">HKD</ion-option> 
     <ion-option value="HRK">HRK</ion-option> 
     <ion-option value="HUF">HUF</ion-option> 
     <ion-option value="IDR">IDR</ion-option> 
     <ion-option value="ILS">ILS</ion-option> 
     <ion-option value="INR">INR</ion-option> 
     <ion-option value="JPY">JPY</ion-option> 
     <ion-option value="KRW">KRW</ion-option> 
     <ion-option value="MXN">MXN</ion-option> 
     <ion-option value="MYR">MYR</ion-option> 
     <ion-option value="NOK">NOK</ion-option> 
     <ion-option value="NZD">NZD</ion-option> 
     <ion-option value="PHP">PHP</ion-option> 
     <ion-option value="ZAR">ZAR</ion-option> 
     <ion-option value="PLN">PLN</ion-option> 
     <ion-option value="RON">RON</ion-option> 
     <ion-option value="RUB">RUB</ion-option> 
     <ion-option value="SEK">SEK</ion-option> 
     <ion-option value="SGD">SGD</ion-option> 
     <ion-option value="THB">THB</ion-option> 
     <ion-option value="TRY">TRY</ion-option> 
     <ion-option value="USD">USD</ion-option> 
     </ion-select> 
    </ion-item> 
    <ion-item> 
     <ion-label>כמות לחישוב</ion-label> 
     <ion-input #amountCurrencyInput type="text"></ion-input> 
    </ion-item> 
    <button ion-button (click)="calc({selectedCurrency:selectCurrencyInput,amountCurrency:amountCurrencyInput.value})"> 
     חשב מטבע 
    </button> 
    </ion-list> 
    <ion-list *ngIf="load" inset> 
    <h2>שער המטח נכון להיום: <span>{{results.date}}</span></h2> 
    <h3>המטבע הנבחר: {{results.base}}</h3> 
    <ion-item> 
     <!-- Object should run here.--> 
    </ion-item> 
    </ion-list> 
</ion-content>

currency.ts

import {Component} from '@angular/core'; 
import {NetworkServices} from '../../services/network'; 


@Component({ 
    selector: 'currency-page', 
    templateUrl: 'currency.html', 
    providers: [NetworkServices] 
}) 
export class CurrencyPage { 
    public load: any; 
    public results: any; 

    constructor(public networkServices: NetworkServices) { 
    this.load = false; 
    } 

    calc(details) { 
    this.networkServices.getCurrency(details).then((result) => { 
     this.load = true; 
     this.results = result; 
    }); 
    } 
}

ТНХ вам ребята :)

источник

2016-10-28 itzikb

* ngFor не предназначен для использования в отношении объектов, но вы можете обойти эту проблему с помощью Object.keys, Попробуйте это возможно

<div *ngFor='let key of Object.keys(yourObject)'> 
    <h3>{{yourObject[key].someProperty}}</h3> 
</div>

источник

2016-10-28 13:10:54

Это может быть опрятным решением этой проблемы, но вы должны выставить объект ' 'to view, чтобы заставить его работать:' private JSObject: Object = Object; 'и использовать его следующим образом:' let key of JSObject.keys (yourObject) ' – Zahema

ngFor= "let x of results?.rates"

должен работать тоже.

источник

2017-02-02 11:48:23 Mai

Вы можете использовать метод на компоненте, который извлекает ключи или многоразовые трубы

@Pipe({name: 'keys'}) 
export class KeysPipe implements PipeTransform { 
    transform(value) : any { 
    if(!value) { 
     return null; 
    } 
    return Object.keys(value); 
    } 
}

<div *ngFor="let key of someObject | keys">{{someObject[key]}}</div>

источник

2017-02-02 11:54:39

* ngFor на объект angular2

ответ

Смежные вопросы