Angular 8 Send Data между одноуровневыми компонентами

Question

Я использую Angular 8. У меня есть два компонента, которые не зависят. Сформируйте первый, я могу нажать на кнопку, чтобы получить доступ ко второму. Оба компонента не отображаются на экране одновременно, когда открывается второй, мы не видим первый. Под кнопкой я использую маршрут с routerLink для доступа ко второму компоненту. Мой первый компонент - это форма, и есть поле с идентификатором. Я хотел бы передать это значение идентификатора от первого компонента ко второму, когда я нажимаю на кнопку, но я не знаю, как это сделать. Как я могу это сделать? Заранее спасибо за помощь.

Answer 1

Сначала вам нужно внедрить службу Router в конструктор вашего первого компонента, как показано ниже.

constructor(private router: Router) { }

Затем при перенаправлении вашего routerlink вы можете передать идентификатор во второй компонент, как показано ниже:

this.router.navigate(['/second-component', Id]);

Вы можете импортировать Router как показано ниже:

import { Router } from '@angular/router';

Answer 2

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

Подробнее см. в этой статье о том, как сделать общий сервис.