从json数据填充的下拉列表



我希望我的下拉菜单显示我的数据中的2017年和2018年。2017和2018在我的json数据文件中重复了很多。但我希望所有2017年的数据在选择时显示,所有2018年的数据都在选择时展示。目前,它显示了所有数据,并且下拉列表填充过多。我被告知要尝试一下,但一直没能成功:

import {DatePipe} from '@angular/common';
.
.
volumes: Volumes[];
years: [] = [];
groupedVolumes : any;
constructor(private volumeService: VolumeService, private router: Router, private datePipe: DatePipe) { 
}

ngOnInit(){
this.volumeService.getVolumes().subscribe(volumes => {
this.volumes = volumes;
for(let volume of volumes){
if(this.years.indexOf(datePipe.formatDate(volume.month, 'yyyy')) === -1)
this.years.push(datePipe.formatDate(volume.month, 'yyyy'));
}
this.groupedVolumes = this.group(this.volumes);
this.dataOk = true;
}
}

Html:

<div class="row justify-content-center">
<div class="col-4s">
<p>Financial Year:</p>
</div>
<div class="col-4s">
<select>
<option *ngFor="let year of years">{{ year }}</option>
</select>
</div>
</div>

Json文件:json文件:

[
{
"id": 1,
"month": "2017-03-01"
}
{
"id": 2,
"month": "2017-04-01"
}
{
"id": 3,
"month": "2017-05-01"
}
{
"id": 4,
"month": "2017-06-01"
}
{
"id": 5,
"month": "2017-07-01"
}
{
"id": 6,
"month": "2017-08-01"
}
{
"id": 7,
"month": "2017-09-01"
}
{
"id": 8,
"month": "2017-10-01"
}
{
"id": 9,
"month": "2017-11-01"
}]

这是DatePipe的问题。它只有一个转换函数,而不是formatDate。它也不喜欢年份:[]=[]

ngOnInit() {
this.years = this.volumeService.getVolumes().subscribe(volumes => {
this.volumes = volumes;
this.volumes.forEach(volume => {
if(!this.years || !(this.years.some(year => year.includes(volume.month.split('-')[0])))) {
this.years.push(volume.month.split('-')[0])
}
});
this.groupedVolumes = this.group(this.volumes);
this.dataOk = true;
}

相关内容

  • 没有找到相关文章

最新更新