Ссылки Angular 2 — Навигация

Ссылки Angular 2 — Навигация

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

Шаг 1 — Добавьте следующий код в файл Inventory.component.ts.

Примечание:

Практический курс по созданию веб-приложения на Angular4

Скачайте БЕСПЛАТНЫЙ мини-курс и изучите базовые возможности JavaScript-фреймворка Angular 4 за ближайшие 3 дня

Узнать подробнее

Объявите html-тег, который содержит функцию onBack, ориентированную на событие click. Таким образом, когда пользователь нажимает на элемент, он будет перенаправлен на страницу Products.

В функции onBack используйте router.navigate для перехода на необходимую страницу.

Шаг 2 — Теперь сохраните весь код и запустите приложение, используя npm. В браузере вы должны увидеть следующий результат.

Ссылки Angular 2 — Навигация

Шаг 3 — Нажмите ссылку Inventory.

Ссылки Angular 2 — Навигация

Шаг 4 — Нажмите ссылку Back to products, в результате вы должны вернуться на страницу Products.

Ссылки Angular 2 — Навигация

Источник: https://www.tutorialspoint.com/

Редакция: Команда webformyself.

Практический курс по созданию веб-приложения на Angular4

Скачайте БЕСПЛАТНЫЙ мини-курс и изучите базовые возможности JavaScript-фреймворка Angular 4 за ближайшие 3 дня

Узнать подробнее

Angular 4. Быстрый старт

Овладейте азами работы с Angular 4

Смотреть

Метки:

Похожие статьи:

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

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

Добавить комментарий