Как «избежать» изменений у детей видны у родителей

Question

Это сценарий. В моем приложении с угловым 8 у меня есть сетка с продуктами. Каждая строка имеет некоторую информацию, такую ​​как название продукта, дата создания и т. Д.

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

Тогда я могу сделать 2 вещи. Я могу сохранить изменения или просто отменить и скрыть модал.

Когда я просто отменяю и модал скрывается, я могу видеть все изменения, которые я сделал в модале, отраженные в соответствующей строке продуктовсетка . Как я могу избежать этого? Я знаю, как работает неизменяемость, и я уже попробовал вариант объявления

changeDetection: ChangeDetectionStrategy

в @Component, изменив свойство на onPush, но это была катастрофа, и она сломала все (Даже я читал оэто, я не знаю, как точно не работает ни)

Должен ли я клонировать [вход] дочернего компонента? Какой обходной путь для этого сценария?

Answer 1

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

Если вы используете привязку модели с [(ngModel)] к полям ввода, я предлагаю клонировать ваш объект перед передачей его модальному. Если вы нажмете «Сохранить», замените старую на новую. Если вы нажмете «Отмена», просто выбросьте клона.