|
所在平台: Udemy |
课程主页: https://www.udemy.com/course/angular-router-course/
课程评论：没有评论
**Angular Router In Depth (Angular 20) 课程内容摘要** 本课程旨在深入讲解如何利用 Angular Router 将 Angular 应用转化为单页面应用 (SPA)，从而提供更流畅、响应更快的用户体验。课程将从零开始，假设学员对 Angular Router 没有先验知识，逐步引导大家掌握路由的核心概念和高级功能。 **课程核心内容：** * **SPA 优势与 Angular Router 基础：** 介绍 SPA 的优势，以及如何使用 Angular Router 将 Angular 应用构建为 SPA。 * **路由配置与导航：** 学习路由配置、路径、路由器出口 (`router-outlet`)、导航链接 (`routerLink` 和 `routerLinkActive`) 等基础概念，并掌握相对与绝对路由的最佳实践。 * **高级路由场景：** 通过主从-详情、详情-详情导航场景，深入学习懒加载模块、使用 Resolvers 进行数据预获取、通过 Guards 保护路由访问、自定义预加载策略、辅助路由 (Secondary Outlets) 等进阶功能。 * **路由细节与策略：** 探讨路径匹配与配置顺序、路由路径与查询参数、路由重定向、深层链接、路由快照与 Observables 的区别、路由加载指示器、路由哈希定位策略、路由模块的额外配置选项（如 `enableTracing`、`scrollPositionRestoration` 等）。 **学习目标：** 完成本课程后，学员将能够： * 熟练地为现有 Angular 应用从头开始设置 Angular Router。 * 不仅掌握路由的基础知识和所有高级功能，更能理解何时以及为何使用它们。 * 学会大量最佳实践，充分发挥 Angular Router 的强大能力。
This Course in a NutshellIn this course, we are going to learn in detail the advantages of building a frontend UI as a single-page application, as opposed to a traditional multi-page application.Single-page applications (or SPAs) have been around for years now, and are today more popular than ever as a simplified way to build enterprise frontends or internet product dashboards.SPAs typically give the end-user a much better user experience, due to their better-perceived performance and responsiveness. In this course, we will learn how to use the Angular Router to turn our Angular application into a SPA.Course OverviewWe are going take as a starting point a small Angular application that does not have any routing yet. We are then going to learn how to configure the Angular Router from scratch. We will assume no prior Angular Router knowledge, as we explain everything from first principles.We will start by introducing the essential router concepts such as route configuration, paths, router outlets, and router navigation links. From these essential concepts, will build a much more advanced routing scenario.We will learn how to build a master-detail with detail-to-detail navigation scenario, and we will use this example to introduce all the advanced routing concepts and powerful features that the Angular Router offers us.This will include lazy loading modules, data pre-fetching with Resolvers, protecting route access with Guards, custom pre-loading strategies, secondary outlets (auxiliary routes), and much more.Table of ContentsThis course covers the following topics:What is a single page application?Best practices for router configuration: home route, page not found route, etc.Essential Router configurations concepts: paths, components, and outletsEssential Router navigation concepts; the routerLink and routerLinkActive directivesRelative vs Absolute routing best practicesUnderstanding Path matching and router configuration orderRouter Path and Query parametersRouter redirectsDeep linking with the Angular router: master-detail with detail-to-detail navigation scenarioUnderstanding router snapshots vs router observablesLazy loaded routesRoute data pre-loading with ResolversRouter module pre-loading strategies, building a custom preloading strategyRouter Guards - CanActivate and CanActivateChild Authentication GuardsPreventing route exits with CanDeactivate guardsChecking if a lazy-loaded module can be loaded with CanLoadRouter Loading IndicatorUnderstanding Router Hash location strategySecondary router outlets and auxiliary routesThe router module extra configuration options: enableTracing, scrollPositionRestoration, paramsInheritanceStrategy, etcWhat Will You Learn In this Course?At the end of this course, you will feel comfortable setting up the Angular Router from scratch in an existing Angular applicationYou will know not only the essentials of the router together with all its most advanced features, but most importantly you will know exactly when to use each feature and why, and you will know numerous best practices that will help you to make the most out of the Angular RouterHave a look at the course free lessons below, and please enjoy the course!
