Добавление события изменения Angular 6 в выпадающий список приводит к ошибке неопределенного значения - PullRequest
Новая
       42

Добавление события изменения Angular 6 в выпадающий список приводит к ошибке неопределенного значения

0 голосов
/ 12 сентября 2018

У меня есть выпадающий список, созданный в каждой строке данных: 

<ng-container matColumnDef="status_change">
  <th mat-header-cell *matHeaderCellDef mat-sort-header>Change Status</th>
  <td mat-header *matCellDef="let row">
    <mat-form-field>
      <form [formGroup]="sitStatus">
        <mat-select (click)="updateUnitSituationStatus()" formControlName="sitStatusControl" placeholder="Change Status To">
          <!-- <mat-option [value]="row.unit_sprotection_status">{{row.unit_sprotection_status}}</mat-option> -->
          <mat-option *ngIf="row.unit_sprotection_status!='Active'" value="Active">Active</mat-option>
          <mat-option *ngIf="row.unit_sprotection_status!='Inactive'" value="Inactive">Inactive</mat-option>
        </mat-select>
      </form>
    </mat-form-field>
  </td>
</ng-container>

Я добавил событие, чтобы получить значение измененного раскрывающегося списка. Другими словами, если я изменил значение раскрывающегося списка в строке id 4, мне нужно изменить значение и идентификатор строки, чтобы я мог обновить свою базу данных.

Я использовал (click) событие, но появилась ошибка:

ОШИБКА TypeError: Невозможно прочитать свойство 'значение' из неопределенного в UnitEditComponent.push

Вот метод: 

updateUnitSituationStatus(){
    console.log(this.formGroup.controls['sitStatusControl'].value);
}

Я пытался использовать (change) событие, но тоже ничего не произошло.

Ответы [ 2 ]

0 голосов
/ 12 сентября 2018

Я не пробовал использовать Material UI, но считаю, что он работает так же, как обычно select

<select (change)="onChangeEvent($event)">
    <option value="option1">My Options</option>
</select>

Тогда в вашем .ts

onChangeEvent(ev) {
    console.log(ev.target.value); // should print option1
}
0 голосов
/ 12 сентября 2018

Так как вы используете sitStatus группу форм здесь <form [formGroup]="sitStatus">, вы должны искать контроль и в этой группе 

this.sitStatus.controls['sitStatusControl'].value
...