Прежде чем вносить изменения в таблицу ag-grid, дождитесь ответа бэкэнда службы - PullRequest
0 голосов
/ 07 ноября 2019

Я использую ag-grid / ag-grid-angular для предоставления редактируемой сетки данных, поддерживаемой базой данных. Когда пользователь редактирует ячейку, я хочу иметь возможность опубликовать обновление в бэкэнд-сервисе, и если запрос успешен, обновите сетку и, если нет, отмените изменения пользователя и покажите ошибку.

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

Моей первой мыслью было использование cellValueChanged. мероприятие. При таком подходе я могу увидеть старые и новые значения, а затем позвонить в мою службу для обновления базы данных. Если запрос выполнен успешно, то все отлично и работает как положено. Однако, если запрос по какой-то причине не выполняется, мне нужно отменить изменения пользователя. Поскольку у меня есть доступ к старому значению, я могу легко сделать что-то вроде event.node.setDataValue(event.column, event.oldValue), чтобы отменить изменения пользователя. Однако, так как я обновляю сетку снова, это фактически вызывает событие cellValueChanged во второй раз. У меня нет возможности узнать, что это является результатом отмены изменений пользователя, поэтому я без необходимости снова обращаюсь к своему сервису с просьбой обновить данные, даже если исходный запрос никогда не был успешным при обновлении данных.

Iтакже пытался использовать пользовательский редактор ячеек, чтобы получить промежуточный результат, когда пользователь заканчивает редактирование ячейки и когда сетка фактически обновляется. Тем не менее, кажется, что нет способа интегрировать асинхронный метод в любой из этих классов, чтобы иметь возможность ждать ответа от сервера, чтобы решить, действительно ли применять изменения пользователя. Например,

isCancelBeforeStart(): boolean {
    this.service.updateData(event.data).subscribe(() => {
      return false;
    }, error => {
      return true;
    });
}

не работает, поскольку этот метод является синхронным, и мне нужно иметь возможность ждать ответа от моей службы, прежде чем принять решение об отмене редактирования или нет.

Есть личто-то я пропускаю или не принимаю во внимание? Или другой способ решения этой проблемы, чтобы получить мою предполагаемую функциональность? Я понимаю, что это можно сделать намного проще с помощью специальных кнопок редактирования / сохранения, но в идеале я ищу интерактивную сетку, которая сохраняет изменения в бэкэнде, когда пользователь вносит изменения и предоставляет обратную связь в случаях, когда что-то пошло не так.

Любая помощь / обратная связь с благодарностью!

1 Ответ

0 голосов
/ 12 ноября 2019

Я понимаю, что вы пытаетесь сделать, и я думаю, что наилучшим подходом будет использование функции "valueSetter" в каждом из ваших редактируемых столбцов.

С помощью ValueSetter - значение сеткине будет обновляться напрямую - вам придется обновить привязанные данные, чтобы они отображались в сетке.

Когда в конце редактирования сетка вызывает valueSetter, вам, вероятно, захочется записатькаким-то образом измените исходное значение, обновите привязанные данные (чтобы сетка отразила изменение), а затем запустите внутреннее сохранение и немедленно вернитесь из функции valueSetter.

(Важно немедленно вернуться из функции valueSetter, чтобы сохранить отзывчивость сетки. Поскольку вызов valueSetter из сетки является синхронным, если вы попытаетесь дождаться ответа сервера, вы собираетесь заблокироватьсетка, пока вы ждете.)

Затем, если внутреннее обновление завершится успешно, ничего не поделаешь, а если оно не удастся, вы можете обновить свои связанные данные, чтобы отразить исходное значение.

При использовании этого метода у вас не будет проблемы прослушивания события cellValueChanged.

Единственная проблема, с которой вам, возможно, придется столкнуться, это что делать, если пользователь изменяет ячейкузначение, а затем снова изменяет его, прежде чем возвращается первое внутреннее сохранение.

...