Условно избежать размытия - PullRequest
0 голосов
/ 16 февраля 2019

У меня есть таблица, в которой каждая ячейка является входом.каждый вход имеет событие (blur) = "updateCell ()".Я использую его для обновления ячейки, из которой был удален фокус.Одна из моих ячеек - поиск вариантов.У каждого варианта есть (click) = "variableSelected ()" слушатель.Очевидно, что когда я нажимаю на вариант, сначала вызывается функция размытия, и в этот момент выбранный вариант не определен.

Мне нужно размытие, чтобы отследить, что фокус был перемещен из ввода.Я также использую его для проверки правильности значения (например, пользователь действительно выбрал вариант, а не просто ввел случайное значение, например 'sdfkljsadflkj; sdf')

Поэтому, если значение не было выбрано, я помещаю начальное значениевместо этого.

Я попытался вызвать updateCell () из optionSelected () и передать выбранный вариант.Однако событие Blur запускает updateCell первым, а вариант не определен.Таким образом, при первом вызове updateCell () у меня вариант undefined, и я не знаю, является ли он неопределенным, потому что пользователь только что удалился , или он не определен, потому что был выбран вариант , но событие размытия сработало первым Полагаю, лучший вариант - как-нибудь отменить событие размытия, когда я нажимаю на один из вариантов поиска.Но я понятия не имею, как это сделать в угловых или даже простых js.

  <input
    #tenant
    class="form-control"
    type="text"
    (focus)="onSetCurrentCell( ('current_tenant-' + property.id), $event )"
    (keyup)="changeValue(property.id, 'current_tenant', $event)"
    (blur)="updateList(property.id, 'current_tenant', $event)"
    [value]="property.current_tenant?.name"
    placeholder="Search..."
    >
     <div 
        class="tenants-variants"
        [class.hidden]="variantsHidden" 
        *ngIf="cellUnderEdit === 'current_tenant-' + property.id"
        >
        <p 
          class="tenant-variant"
          *ngFor="let tenantVariant of tenantsVariants"
          (click)="onSelectTenantVariant(tenantVariant, tenant);">
          {{tenantVariant.name}}
        </p>
      </div>

В моем файле .ts

onSelectTenantVariant(tenantVariant: ITenantVariant, tenantRef) {
    ...some code
    this.updateList(propertyId, columnProperty, null, tenantVariant);
}

updateList(propertyId: number, columnProperty: string, event?: any, tenantVariant?: ITenantVariant) {
    this.editingStatusChanged.emit({isEditing: true});
    if (columnProperty === 'current_tenant') {
      // variant will be undefined at first call even if varaint was selected.
      // because updateList is called before onSelectTenantVaraint()
      if (variant) {
        this.updatedPropertiesObject[propertyId] = {
          ['property_id']: propertyId,
          ...this.updatedPropertiesObject[propertyId],
          ...{[columnProperty]: variant.id}
        };
      }else {
        ...
      }
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...