角2阵列：分类成基于用户输入
问题描述：
数据集我通过此数据源 http://www.ecb.europa.eu/stats/eurofxref/eurofxref-hist-90d.xml角2阵列：分类成基于用户输入
我已转换的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"
}
]
}
]
}
答
在这种情况下我会假设，基于该数据，有总是只有一个具有特定日期的对象。
然后，我们可以很容易地使用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>
有永远只是一个对象，具有特定的日期，我猜是这样？ – Alex
是的，它们都是唯一指定的日期 – eohdev