Сегодня становится популярным предложение пользователю отменить удаление. Пользователь может легко пропустить клик и удалить данные, которые он не хочет удалять. Я создал для вас пример массива с 3 идентификаторами и компонентом удаления/отмены:
По сути, с этим компонентом вы можете легко манипулировать, его легко манипулировать путем оптимистичного удаления, а также подключить его к хранилищу ngrx. См. полностью рабочий пример: https://stackblitz.com/github/marekpanti/delete-undo
Во-первых, мы создаем службу, которая отслеживает countDown для нашей функции отмены, затем мы отслеживаем идентификаторы. В моем примере я использовал жестко заданные идентификаторы, но я рекомендую использовать уникальный идентификатор, есть пакет npm для uuid https ://www.npmjs.com/package/uuid, который я настоятельно рекомендую.
Когда служба завершена, я создал удаление/отмену компонента
В компоненте удаления — отмены 2 вещи необходимы для правильного вызова нашего сервиса, а затем наличия методов, которые должны происходить при удалении и при отмене. Но все же это всего лишь простой компонент, который нужно вызывать в родительском компоненте, где находится наш массив элементов, ожидающих красивого удаления.
В родительском компоненте важно иметь метод remove() — вспомогательный метод для метода removeRow(). Метод remove() связывает метод removeRow() с нашей службой addCountDown(), а removeRow() выполняет простое удаление из массива благодаря splice().
Надеюсь, вам понравился мой способ решения функции удаления/отмены, есть много хороших практик решения этой проблемы. Здесь я попытался показать простой вариант использования, который можно легко использовать везде в качестве общего компонента.
