Как автоматически установить флажок, когда данные вводятся в эту конкретную строку - PullRequest
Новая
       28

Как автоматически установить флажок, когда данные вводятся в эту конкретную строку

0 голосов
/ 19 июня 2019

Я использую угловой mastertoggle для таблицы с выбором.Строка таблицы выбирается при нажатии флажка в этой строке. В этой таблице также есть поле ввода

Как автоматически выбрать эту строку, когда пользователь заполняет поле.Я хочу, чтобы флажок устанавливался как при нажатии, так и когда пользователь заполняет поле в этой строке enter image description here

это код основного флажка выбора и флажок каждой строки 

<ng-container matColumnDef="select">
<th mat-header-cell *matHeaderCellDef>
  <mat-checkbox (change)="$event ? masterToggle() : null"
                [checked]="selection.hasValue() && isAllSelected()"
                [indeterminate]="selection.hasValue() && !isAllSelected()">
  </mat-checkbox>
</th>
<td mat-cell *matCellDef="let row">
  <mat-checkbox (click)="$event.stopPropagation()"
                (change)="$event ? selection.toggle(row) : null"

                [checked]="selection.isSelected(row)">
  </mat-checkbox>
</td>

поле ввода - дата 

<ng-container matColumnDef="date" >
<th mat-header-cell *matHeaderCellDef> {{date}}</th>
<td mat-cell *matCellDef="let row">
  <span >{{row.date}}</span>
  <mat-form-field >
    <div class="date-picker-container" >
      <input class="date-picker form-control" ngx-mydatepicker
             matInput [name]="date"
             [ngModel]="row.date|localDateToDatePickerDate"             
             (dateChanged)="onDateUpdate($event, row)"
             [options]="datePickerOptions" #datePicker="ngx-mydatepicker"

             [appRequiredIf]="selection.isSelected(row)"/>
      <button type="button" mat-button class="button-calendar"
              (click)="dueDatePicker.toggleCalendar()"
              </button>
    </div>
  </mat-form-field>
</td>

я попытался изменить 

[checked]="selection.isSelected(row)"

на 

[checked]="selection.isSelected(row) || !!row.date">

он проверяет, когда введена дата, но это изменение цвета фона выбранной строки или промежуточная проверка для основного выбора не отражаются

1 Ответ

0 голосов
/ 19 июня 2019

Для вашего варианта использования для работы с шаблонно-управляемыми формами обнаружение изменений должно запускаться несколько раз. Это не. Вам нужно будет либо вручную установить флажки при изменении данных, либо вам придется использовать реактивные формы (настоятельно рекомендуется).

...