Лучшая практика для передачи объекта между сеткой и страницей редактирования в Angular 8+

Question

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

поэтому, когда я нажимаю кнопку редактирования в сетке, я перехожу к компоненту create-edit-account, чтобы использовать его также для редактирования.

после нажатия кнопки редактирования я перемещаюсь следующим образом

 edit(account: BankAccount) {
this.router.navigateByUrl('/create-edit-account/' + account.id);
 }  

, но в то время, когда я нажимал кнопку редактирования, у меня есть заполненный объект учетной записи, который я хочу передать компоненту create-edit-account.

Вопрос 1 как лучше всего передавать объект при использовании параметризованных маршрутов в Angular 8+

Вопрос 2 как мы сообщаем компонент, для редактирования или добавления которого он используется. Я узнал, что если я передаю «0» в параметре идентификатора маршрута, мы можем считать, что он используется как «новый». но есть ли лучший подход?

У меня также есть хранилище ngrx. Итак, Вопрос 3 , вы бы порекомендовали использовать диспетчер действий с чем-то, называемым «обновление учетной записи», передавая объект в качестве параметра действия и подписывая его в компоненте create-edit-account, а затем отправляя «account- обновленное "действие?"

Answer 1

Q1: вы можете использовать резолверы, они могут извлекать данные и передавать их вместе с ActivatedRoute.

Q2: у вас должен быть независимый URL-адрес для режима редактирования, тогда компонент может определять его состояние и переключаться между показом / редактированием, также пользователи могут делиться желаемой страницей для отображения или редактирования компонента.

В качестве опции вы можете иметь внутреннее состояние в компоненте и кнопку, которая переключает его на отображение / редактирование. Но в этом случае пользователи всегда должны нажимать кнопку.

Q3: Для того, что вы описываете, вы должны использовать эффекты ngrx. Затем эффект прослушивает запрос на обновление и выполняет его. После завершения запроса он отправляет действие для установки обновленного объекта в хранилище.

Answer 2

Мы должны использовать мощность ngrx там, где она действительно требуется. Я имею в виду, когда есть обмен данными, которые используются моими несколькими компонентами одновременно в одном представлении. Такого рода сценарии ios.

Ваш конкретный случай прост

Создайте службу, перед навигацией установите эти данные в свойстве в этой службе и при инициализации вашего create-edit компонент получить эти данные. В этих данных вы можете указать, где создать учетную запись или изменить флаг учетной записи в том же объекте данных.

Я хочу, чтобы он сохранял данные на refre sh, используйте localStorage или sessionStorage согласно сценарию.