路由,简单的来说就是让组件之间进行跳转和参数的传递。

1、先在app目录下创建一个名为app.route.ts的路由组件

2、打开app.route.ts 在里面创建路由组件的代码(可通过编辑器快捷生成)

3、开始配置路由词典,引入对应的组件

4、把代码中的forChild 改成forRoot

5、最后导出为AppRoutingModule

6、在app目录下找到app.module.ts

7、最后一步,打开app.component.ts,添加<router-outlet></router-outlet>

做完以上这几步,路由就算是配置成功,可以使用了

  

Angular 路由配置的更多相关文章

  1. angular路由配置以及使用

    一.生成路由文件 按照惯例,有一个独立模块来配置相关路由,这个模块类的名字叫做AppRoutingModule,位于src/app下的app-routing.module.ts文件中. 使用CLI生成 ...

  2. angular路由配置用法

      在如今,很多事用于HTML5嵌套在webview,成为(伪)app,用a链接来跳转,简单页面来说的话,速度还是可以的,但是应用越来越多,是用不流畅,当然原生的app像安卓以及IOS来说的话,跳转是 ...

  3. angular 路由项目例子

    angular 路由是我在工作中体验非常便捷的一点, 这是详细的API ,查看API 可以了解很多东西, https://github.com/angular-ui/ui-router/wiki/Qu ...

  4. angular 8 配置路由

    一.生成路由文件 按照惯例,有一个独立模块来配置相关路由,这个模块类的名字叫做AppRoutingModule,位于src/app下的app-routing.module.ts文件中. 使用CLI生成 ...

  5. angular路由详解:

    1.$routeProvider ngRoute模块中的服务 2.otherwise:设置用于路由改变时,与任何其他定义的路由无法匹配的时候执行的代码 3.when:为$route服务定义新的路由 例 ...

  6. angular路由

    ngRoute需要引进以下文件 <script src="http://code.angularjs.org/1.2.5/angular.min.js"></sc ...

  7. angular2地址栏路由配置

    一步一步route过去可以,地址栏直接写url怎么就找不到了呢? 这关乎于Nodejs的express路由规则(http://hm4123660.iteye.com/blog/2195035) exp ...

  8. angular路由参数说明

    AngularJS 路由 本章节我们将为大家介绍 AngularJS 路由. AngularJS 路由允许我们通过不同的 URL 访问不同的内容. 通过 AngularJS 可以实现多视图的单页Web ...

  9. angular路由详解六(路由守卫)

    路由守卫 CanActivate: 处理导航到某个路由的情况. CanDeactivate:处理从当前路由离开的情况. Resole:在路由激活之前获取路由数据. 1.CanActivate: 处理导 ...

随机推荐

  1. First:安装配置JDK and 部署Tomcat

    (一)准备 百度云地址(win,64Bit): 1.tomcat(7.0):链接:https://pan.baidu.com/s/1f60DOGO5Hnj9bq-987FNrw 密码:6q55 2.j ...

  2. SpringCloud的应用发布(四)顺序启动各个应用

    一.部署应用 二.启动应用(注意顺序) 三.观察效果 1.查看进程和日志 ps -ef | grep java tail -f AppYml.txt 2.验证功能

  3. Spring Security 入门(1-3-5)Spring Security - remember me!

    Remember-Me 功能 概述 Remember-Me 是指网站能够在 Session 之间记住登录用户的身份,具体来说就是我成功认证一次之后在一定的时间内我可以不用再输入用户名和密码进行登录了, ...

  4. Spring Security入门(3-8)Spring Security获取session中的UserDetail

  5. python实现:最长子字符串

    给定一个字符串 s 和正整数 n,请使用你熟悉的编程语言输出 s 中包含不超过 n 种字符的最长子串,如 s="uabbcadbaef",n=4 时应该输出 "abbca ...

  6. RxJava系列3(转换操作符)

    RxJava系列1(简介) RxJava系列2(基本概念及使用介绍) RxJava系列3(转换操作符) RxJava系列4(过滤操作符) RxJava系列5(组合操作符) RxJava系列6(从微观角 ...

  7. Mysql官方文档翻译系列14.18--MySql备份与恢复

    原文链接: (https://dev.mysql.com/doc/refman/5.7/en/innodb-backup-recovery.html) The key to safe database ...

  8. Hibernate(五):Hibernate配置文件及C3P0的用法

    配置文件可配项: 参考文档:hibernate-release-5.2.9.Final/documentation/userguide/html_single/Hibernate_User_Guide ...

  9. POJ-3169 Layout---差分约束系统+Bellman

    题目链接: https://vjudge.net/problem/POJ-3169 题目大意: 一些母牛按序号排成一条直线.有两种要求,A和B距离不得超过X,还有一种是C和D距离不得少于Y,问可能的最 ...

  10. 极速下载百度网盘-吴水成老师的-dubbo课程

    极速下载百度网盘-吴水成老师的-dubbo课程,极速下载百度网盘-吴水成老师的-dubbo课程,极速下载百度网盘-吴水成老师的-dubbo课程,极速下载百度网盘-吴水成老师的-dubbo课程 先看主目 ...