我正在尝试遍历此数据源 http://www.ecb.europa.eu/stats/eurofxref/eurofxref-hist-90d.xml
我已成功将xml响应转换为JSON,但我很难将响应分类为日期集。
所以基本上我试图遍历数组,如果用户输入数组中存在的日期,那么只使用相应的数据集(索引)。
例如。如果用户选择此日期" 20170811"那么我只想要" 20170811"
的数据集(货币,费率)这是我的代码 // TS
this.forexDataService.getData().then((data) => {
this.data = data;
for(var i = 0; i < this.data.length; i++){
this.time = this.data[i].time;
console.log(this.time);
}
});
// HTML
<ion-list>
<ion-item>
<ion-label>Date</ion-label>
<ion-select [(ngModel)]="Date" (ionChange)='date($event)' name="date">
<ion-option *ngFor="let item of data" [value]="item.time">{{item.time}}</ion-option>
</ion-select>
</ion-item>
</ion-list>
// JSON示例
{
"docs": [
{
"time": "20170811",
"Cube": [
{
"currency": "USD",
"rate": "1.1765"
},
{
"currency": "JPY",
"rate": "128.41"
},
{
"currency": "BGN",
"rate": "1.9558"
},
{
"currency": "CZK",
"rate": "26.155"
},
{
"currency": "DKK",
"rate": "7.437"
},
{
"currency": "GBP",
"rate": "0.90645"
},
{
"currency": "HUF",
"rate": "305.41"
},
{
"currency": "PLN",
"rate": "4.2888"
},
{
"currency": "RON",
"rate": "4.5778"
},
{
"currency": "SEK",
"rate": "9.6083"
},
{
"currency": "CHF",
"rate": "1.132"
},
{
"currency": "NOK",
"rate": "9.3975"
},
{
"currency": "HRK",
"rate": "7.3982"
},
{
"currency": "RUB",
"rate": "70.6275"
},
{
"currency": "TRY",
"rate": "4.1765"
},
{
"currency": "AUD",
"rate": "1.4962"
},
{
"currency": "BRL",
"rate": "3.7378"
},
{
"currency": "CAD",
"rate": "1.4956"
},
{
"currency": "CNY",
"rate": "7.8414"
},
{
"currency": "HKD",
"rate": "9.1992"
},
{
"currency": "IDR",
"rate": "15722.96"
},
{
"currency": "ILS",
"rate": "4.2171"
},
{
"currency": "INR",
"rate": "75.496"
},
{
"currency": "KRW",
"rate": "1346.47"
},
{
"currency": "MXN",
"rate": "21.1711"
},
{
"currency": "MYR",
"rate": "5.0531"
},
{
"currency": "NZD",
"rate": "1.6149"
},
{
"currency": "PHP",
"rate": "60.033"
},
{
"currency": "SGD",
"rate": "1.6052"
},
{
"currency": "THB",
"rate": "39.107"
},
{
"currency": "ZAR",
"rate": "15.8741"
}
]
},
{
"time": "20170810",
"Cube": [
{
"currency": "USD",
"rate": "1.1732"
},
{
"currency": "JPY",
"rate": "128.76"
},
{
"currency": "BGN",
"rate": "1.9558"
},
{
"currency": "CZK",
"rate": "26.157"
},
{
"currency": "DKK",
"rate": "7.4381"
},
{
"currency": "GBP",
"rate": "0.90303"
},
{
"currency": "HUF",
"rate": "305.37"
},
{
"currency": "PLN",
"rate": "4.2717"
},
{
"currency": "RON",
"rate": "4.5743"
},
{
"currency": "SEK",
"rate": "9.568"
},
{
"currency": "CHF",
"rate": "1.1341"
},
{
"currency": "NOK",
"rate": "9.3355"
},
{
"currency": "HRK",
"rate": "7.4008"
},
{
"currency": "RUB",
"rate": "70.2875"
},
{
"currency": "TRY",
"rate": "4.1462"
},
{
"currency": "AUD",
"rate": "1.4888"
},
{
"currency": "BRL",
"rate": "3.7024"
},
{
"currency": "CAD",
"rate": "1.4923"
},
{
"currency": "CNY",
"rate": "7.8068"
},
{
"currency": "HKD",
"rate": "9.168"
},
{
"currency": "IDR",
"rate": "15670.45"
},
{
"currency": "ILS",
"rate": "4.2182"
},
{
"currency": "INR",
"rate": "75.208"
},
{
"currency": "KRW",
"rate": "1341.21"
},
{
"currency": "MXN",
"rate": "21.0547"
},
{
"currency": "MYR",
"rate": "5.0348"
},
{
"currency": "NZD",
"rate": "1.6142"
},
{
"currency": "PHP",
"rate": "59.567"
},
{
"currency": "SGD",
"rate": "1.6"
},
{
"currency": "THB",
"rate": "39.021"
},
{
"currency": "ZAR",
"rate": "15.674"
}
]
}
]
}
答案 0 :(得分:2)
在这种情况下,我会假设,根据数据总是只有一个具有特定日期的对象。
然后,我们可以轻松地使用find()
来获取该对象,并显示该特定日期的rate
和currency
。
因此,您的select
保持不变,更改事件将如下所示:
date(date) {
this.filteredDate = this.data.find(x => x.time === date);
}
然后在模板中我们可以只显示数组Cube
的内容,它现在是filteredDate
的属性。我们当然需要设置一个if
,如果没有匹配的对象,列表将不会显示。所以做这样的事情:
<ion-list *ngIf="filteredDate">
<ion-item *ngFor="let item of filteredDate.Cube">
Currency: {{item.currency}}, Rate: {{item.rate}}
</ion-item>
</ion-list>