Ссылка на предыдущий урок 3: Навигация по маршрутизатору из файла angular TS (Программирование навигации)

https://medium.com/@yuvayuvaraj720444/router-03-navigate-router-from-angular-ts-file-programming-navigation-dc68d4928974

Я создал один компонент и назвал его динамическим компонентом.

в app.module.ts,

для настройки роутера по параметру получаем что не уверены. Указываем через двоеточие (:) и имя динамического значения. Здесь я объявил id.

Это все для нашей конфигурации маршрута.

Изучите эту задачу с помощью Live Demo: https://stackblitz.com/edit/angular-ivy-parameter-router

В файле app.component.ts

Не так много HTML-кода. Один div для навигации по маршруту на домашнюю страницу, один div для программного перехода к динамическому компоненту для получения динамически сгенерированных значений и отображения в HTML-файле динамического компонента.

Вывод app.component.html

В файле app.component.ts, вот основной код, чтобы сконцентрироваться

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

ЭТО ВСЕ О ПЕРЕХОДЕ К ДИНАМИЧЕСКИМ ЗНАЧЕНИЯМ

СЕЙЧАС ПОЛУЧИТЬ ДИНАМИЧЕСКИЕ ЗНАЧЕНИЯ

Я сделал это простым html, он выполняет только две функции: ссылка anker для программной передачи значения и {{ id }} для получения динамических значений.

В файле ts динамического компонента.

Я импортировал маршрутизатор, активировалRoute и ввел в конструктор то же самое.

Проще говоря, activatedRouter используется для получения значений маршрутизатора, а маршрутизатор используется для маршрутизации к другому маршрутизатору.

мы используем активированный снимок маршрута, чтобы получить значения маршрута.

ВЫХОД

Каждый раз, когда вы нажимаете на него, значение изменяется и переходит к маршруту динамического.

В следующем блоге

Маршрутизатор 5: использование Observables для получения параметров маршрута вместо моментального снимка

— — — — — — — — — Конец лекции — — — — — — —

Проверьте все уроки Angular Intermediate Lessons

https://medium.com/@yuvayuvaraj720444/angular-intermediate-lessons-acbea2dfc9b