Каков эффект от сохранения параметров запроса Angular Router?

Question

Per эта статья с Angular можно сохранить параметры запроса, такие как:

goUsers() {
  this.router.navigate(['/users'], { queryParamsHandling: 'preserve' 
   });
}

Я ищу практические примеры, которые показывают, почему мы можем захотеть сделать это?

Answer 1

Предположим, вы находитесь на:

http://localhost:4200/heros?hero=jack

И вы хотите переместиться в кризисный центр, но оставьте jack героем, чтобы вы могли сопоставить jack до кризиса.

goCrises() {
  this.router.navigate(['/crises-center'], { queryParamsHandling: 'preserve' 
  });
}

Это изменяет URL-адрес на http://localhost:4200/crises-center?hero=jack, и этот компонент может получить параметр hero через ActivateRoute и сопоставить героя с кризисом.

Answer 2

Если вы посмотрите на определение queryParamsHandling (там не так много дано), оно должно обрабатывать следующую навигацию.

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

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

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