Как отсортировать матовый вариант в ангалр JS? - PullRequest
Новая
       11

Как отсортировать матовый вариант в ангалр JS?

1 голос
/ 17 октября 2019

Я новичок в anguar JS, и я не знаю, как сортировать данные в параметре mat. Пожалуйста, помогите мне решить эту проблему. Позвольте мне поделиться с моей стороны тем, что я пытался.

component.ts 

using service i am calling API and data is array format.
ngOnInit() {
    this.woService.GetFilters().subscribe((r: any) => {
      for (let index = 0; index < r.length; index++) {
        this.fields = r;
      }
    });
  }

onChange1(e) {
    this.fieldText1 = e.source.selected.viewValue;
    for (let index = 0; index < this.fields.length; index++) {
      if (e.value === this.fields[index].FieldName) {
        this.fieldType1 = this.fields[index].FieldDataType;
      }
    }
    if (this.fieldType1 === 'integer') {
      this.operations1 = [
        { value: 'EQ', viewValue: 'equal to' },
        { value: 'GT', viewValue: 'greater than' },
        { value: 'LT', viewValue: 'less than' },
        { value: 'GE', viewValue: 'greater than or equals' },
        { value: 'LE', viewValue: 'less than or equals' }
      ];
    } else if (this.fieldType1 === 'character') {
      this.operations1 = [
        { value: 'BEGINS', viewValue: 'begins with' },
        { value: 'MATCHES', viewValue: 'matches' },
        { value: 'EQ', viewValue: 'equal to' }
      ];
    } else if (this.fieldType1 === 'date') {
      this.operations1 = [
        { value: 'EQ', viewValue: 'equal to' },
        { value: 'GT', viewValue: 'greater than' },
        { value: 'LT', viewValue: 'less than' },
        { value: 'GE', viewValue: 'greater than or equals' },
        { value: 'LE', viewValue: 'less than or equals' }
      ];
    } else if (this.fieldType1 === 'logical') {
      this.operations1 = [
        { value: 'EQ', viewValue: 'equal to' }
      ];
    } else if (this.fieldType1 === 'decimal') {
      this.operations1 = [
        { value: 'EQ', viewValue: 'equal to' }
      ];
    }
  }

component.html 

 <mat-form-field appearance="outline" style="width: 33%;">
                    <mat-label">Field</mat-label>
                    <mat-select (selectionChange)="onChange1($event)" formControlName="field1">
                        <mat-option *ngFor="let field of fields" [value]="field.FieldName ">
                            {{field.FieldDisplayName}}
                        </mat-option>
                    </mat-select>
 </mat-form-field>

Формат JSON из API enter image description here

Я хочу отсортировать по FieldDisplayName

1 Ответ

2 голосов
/ 17 октября 2019

Прежде всего, почему вы перебираете массив, когда получаете данные? Вы можете легко отсортировать массив с помощью функции .sort(). 

ngOnInit() {
  this.woService.GetFilters().subscribe((r: any[]) => {
    this.fields = [];
    r.forEach((data: any) => {
      if(!this.fields.find((field) => field.FieldDisplayName == data.FieldDisplayName) {
        this.fields.push(data);
      }
    });
    this.fields.sort((a, b) => {
       if(a.FieldDisplayName > b.FieldDisplayName) {
         return 1;
       } else if(a.FieldDisplayName < b.FieldDisplayName)
         return -1;
       } else {
         return 0;
       }
    });
  });
}
...