多个mat-select来自JSON数据

问题描述 投票:0回答:1

我有一个Angular 6应用程序选择一个城市(我称之为西班牙语corregimiento),取决于地区,并根据this JSON file省选择地区。

  <!-- ***************SELECT Province *************** -->     
<mat-form-field>
    <mat-select placeholder="Provincia" [(ngModel)]="selectedProvince" name='shit' [(value)]="sltdProv">
      <mat-option *ngFor="let item of datas" [value]="item.distritos" >
        {{ item.name }}
      </mat-option>
    </mat-select>
  </mat-form-field>
  <!-- ***************SELECT District *************** -->
  <mat-form-field *ngIf='selectedProvince'>
    <mat-select placeholder="Distrito" [(ngModel)]="selectedDistr" name='District'>
      <mat-option *ngFor="let distrito of sltdProv" [value]="distrito.corregimientos">
        {{ distrito.name }}
      </mat-option>
    </mat-select>
  </mat-form-field>
  <!-- ***************SELECT City *************** -->
  <mat-form-field *ngIf='selectedDistr && selectedProvince'>
    <mat-select placeholder="Corregimiento" [(ngModel)]="selectedCorr" name='Corr'>
      <mat-option *ngFor="let sub of selectedDistr" [value]="sub.name">
        {{ sub.name }}
      </mat-option>
    </mat-select>
  </mat-form-field>

在Components文件中我有:

selectedProvince: string;
selectedDistr: string;
selectedDistrict: string;
datas: any;

ngOnInit() {
const Semester = this.getFile.getJSON();
this.http
  .request("../../assets/jsonFolder/panamaData.json")
  .subscribe((res: Response) => {
    this.datas = res.json().provincia;

这将选择文件中JSON的第一个(也是唯一的)值。这是一个包含13个JSON对象的数组,每个对象都是省和省。

我可以在DOM上做到完美。但是,如果我只想将省的名称保存为变量,它会给我一些JSON对象。各区也一样。唯一好的是城市,因为最后一个是一个字符串。

angularjs json angular-material angular6 ngfor
1个回答
0
投票

我在你的JSON文件中发现了一些问题。它有Duplicate'name'变量

id:04 -> id:04-1 -> id:04-1-01 

项目。你还可以添加样本plunker链接,它将有助于调试问题。

© www.soinside.com 2019 - 2024. All rights reserved.