Angular 8 передает данные дочерним маршрутам

#angular #angular8

#angular #angular8

Вопрос:

 const routes: Routes = [
    {
        path:      'a',
        component: MainComponent,
        children:  [
            {
                path:      'ab',
                component: ABComponent
            },
            {
                path:      'ac',
                component: ACComponent
            }
        ],
    }
  

В Angular 8 рассмотрите приведенный выше сценарий, в котором мне нужно передавать данные между MainComponent -> ABComponent

Я не хочу использовать сервисный подход. Я также пытался получить данные, используя this._router.getCurrentNavigation().extras.state, но я получаю null [я использовал его в конструкторе]. Я даже пытаюсь получить данные с помощью window.history.state. Оба компонента не работают для родительского и дочернего компонентов маршрутизации. Кто-нибудь знает причину, по которой он не работает?

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

Примечание: данные большие, поэтому я не хочу передавать их в параметрах.

Добавление дополнительной информации:

Использование приведенного ниже кода позволит получить данные, но есть недостаток.

 ngOnInit() {
this.state$ = this.activatedRoute.paramMap
  .pipe(map(() => window.history.state))
  

}

Рассмотрим приведенную ниже конструкцию

Левая сторона Правая сторона

Maincomponent[Содержит форму] [ABComponent] Результаты формы в таблице

Начальный URL-адрес маршрута «.. / a» будет отображать только форму [слева], затем в URL-адресе «.. / a / ab» будут отображаться как форма, так и результат.

Когда я отправляю форму, URL-адрес моего маршрута будет [/a / ab]. Первоначально я получу данные в состоянии, но при повторной отправке формы с другими значениями новые данные не будут получены.

Поэтому, пожалуйста, предложите, какой будет хороший подход к решению вышеуказанной проблемы.

Комментарии:

1. «состояние» должно быть прочитано в ngOnInit, см., Например: netbasal.com /. … Будьте осторожны, вы получаете данные двумя разными способами: когда вы получаете данные из main.component и когда вы получаете данные от дочерних элементов

2. Я попробовал window.history.state только в ngOnInit, но я не добился успеха для родительско-дочерних маршрутизируемых компонентов

3. Лучше использовать Input() или Observable

4. @Yaseer это классические подходы, но я пробую любые новые подходы