git clone git@github.com:len007/my-angular2-app.git my-angular2-app

开始

一个URL = 一个页面 = 一个Component。

我们可以使用路由来实现页面之间的切换与导航。

使用路由前,我们先安装router包:

npm --save-dev install router

首先,我们建立个根路由,app-router.module.ts

import { Routes } from '@angular/router';

export const AppRouterModule: Routes =[
{
path: '',
loadChildren: 'app/home/home.module#HomeModule'
},
{
path: 'list',
loadChildren: 'app/list/list.module#ListModule'
},
{
path:'**',
loadChildren: 'app/home/home.module#HomeModule'
}
];

这是最简单的路由配置

路由导航之第一个子模块(HomeModule)的更多相关文章

  1. vue父路由默认选中第一个子路由,切换子路由让父路由高亮不会消失

    vue父路由默认选中第一个子路由,切换子路由让父路由高亮不会消失 正常默认会有 .router-active-class 识别高亮 达到以上注意: 1. exact 不要加 注意是不要加,exact ...

  2. 如何在idea里面新建一个maven项目,然后在这个maven项目里创建多个子模块

    如何在idea里面配置maven我这里就不多说了 先新建一个maven项目作为总的管理项目 不用勾选什么,直接下一步 这样子一个普通的maven项目就创建成功了. 因为这个项目是用来管理多个子模块的, ...

  3. 请问:关于织梦dedecms点击导航上的父栏目进去默认显示第一个子栏目的列表的问题

    要设置织梦dedecms点击导航上的父栏目进去默认显示第一个子栏目的列表, 就按照如下图所示的方法进行操作,为什么 点击导航上的父栏目出现死循环呢, 根本浏览不了网页. 请各位大神指点指点,为什么点击 ...

  4. Java 9 揭秘(3. 创建你的第一个模块)

    文 by / 林本托 Tips 做一个终身学习的人. 在这个章节中,主要介绍以下内容: 如何编写模块化的Java程序 如何编译模块化程序 如何将模块的项目打包成模块化的JAR文件 如何运行模块化程序 ...

  5. DEDECMS点击主栏目默认显示第一个子栏目列表的方法

    本文实例讲述了DEDECMS点击主栏目默认显示第一个子栏目列表的方法.分享给大家供大家参考.具体分析如下: 今天公司有个需求是,点击导航上的父栏目进去默认显示第一个子栏目的列表,以下是具体实现方法,可 ...

  6. Vue2学习小记-给Vue2路由导航钩子和axios拦截器做个封装

    1.写在前面 最近在学习Vue2,遇到有些页面请求数据需要用户登录权限.服务器响应不符预期的问题,但是总不能每个页面都做单独处理吧,于是想到axios提供了拦截器这个好东西,再于是就出现了本文. 2. ...

  7. vue_VueRouter 路由_路由器管理n个路由_并向路由组件传递数据_新标签路由_编程式路由导航

    路由:就是一个 key 与 value 的映射关系.key 就是 pathh 前台路由的 value 是 Component 组件对象 后台路由的 value 是一个 回调函数 普通链接: 会发送请求 ...

  8. Vue-初步了解vue-router的三要素:路由map 、路由视图、路由导航

    安装vue-router模块 使用vue-router前要先安装vue-router库 cnpm install vue-router –save 使用vue-router vue-router有三个 ...

  9. phpcms单页顶级栏目默认打开第一个子栏目方法

    首先phpcms单页如过下面有子栏目,那么当前栏目是不能被编辑内容的,且访问后是没有内容的,首先不知道这是不是产品设计的一个缺陷,但是在使用过程中确实在后台也没有找到其他的对应解决办法,刚好在某QQ群 ...

随机推荐

  1. vxworks开发中simulator的使用之建立虚拟网卡

    在使用windriver workben ch开发vxWorks应用时,有时需要在本机上利用Simulator跑一下程序,这就需要你安装一个虚拟的网卡.vxWorks自带了这些工具,下面,以windo ...

  2. springboot整合JPA(简单整理,待续---)

    整合步骤 引入依赖: <dependencies> <dependency> <groupId>org.springframework.boot</group ...

  3. kubernets code-generator

    REF: how-to-generate-client-codes-for-kubernetes-custom-resource-definitions-crd Firstly we need to ...

  4. JavaScript中对象和数组的深拷贝

    不管是在面试中还是我们的项目中经常会用到数组或者对象的深拷贝,下面我就自己总结的分享给大家. 首先要知道什么是深拷贝?什么是浅拷贝? 深拷贝:源对象与拷贝对象互相独立,其中任何一个对象的改动都不会对另 ...

  5. android TextView描边

    前言 上一篇已经讲了如何实现textView中粗字体效果,里面主要重写了onDraw方法. 这一边讲一个进阶功能,实现textView的描边效果. 上效果图. 上代码: public class St ...

  6. pat1003 迪杰斯特拉法和dfs求最短路

    本题的背景是求定点和定点之间的最短路问题(所有的最短路 不是一个解  是全部解,方法手段来自数据结构课程中的迪杰斯特拉算法和dfs(深度优先遍历). 分别用两种方法编程如下代码 dfs #includ ...

  7. C# 利用反射动态给模型Model 赋值

    https://www.cnblogs.com/waitingfor/articles/2220669.html object ff = Activator.CreateInstance(tt, nu ...

  8. 何给域名配置https证书

    原文链接:https://www.cnblogs.com/ymwang/p/6893105.html http和https的区别就是,后者在网络传输过程中会很安全,原因就是给http安装了SSL证书. ...

  9. firefox(火狐)下 js中设置checkbox属性checked="checked"已有,但复选框却不显示勾选的原因

    刚看到问题时以为是浏览器兼容性的原因,ie.google都能正常显示. 网上查询之后发现是jQuery的attr()方法用的不恰当. jQuery1.6之前使用attr()可以修改 ,从jQuery ...

  10. Python3学习笔记----生成器

    生成器的作用 生成器可以在循环的过程中推算出后续的元素,不必创建完整的list,从而节省大量空间. 生成器的创建 1.把一个列表生成式的 [ ] 改写为( ) # -*- coding: UTF-8 ...