У меня есть таблица, в которой каждая ячейка является входом.каждый вход имеет событие (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 {
...
}
}