angular4路由设置笔记
场景说明:angular4开发的一个后台项目
一、可以使用angular-cli
创建一个带路由的项目,ng new 项目名称 --routing
会多创建一个app-routing.module.ts
文件代码如下:
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router'; const routes: Routes = [
{
path: '',
children: []
}
]; @NgModule({
imports: [RouterModule.forRoot(routes)],
exports: [RouterModule],
providers: []
})
export class AppRoutingModule { }
二、手动配置路由文件
在app
文件夹下面创建一个app.router.ts
文件,基本结构代码如下:
angular路由中涉及到很多新单词词汇
单词 | 说明 | 使用场景 |
---|---|---|
Routes | 配置路由,保存URL对应的组件,以及在哪个RouterOutlet中展现 | |
RouterOutlet | 在html中标记挂载路由的占位容器 | |
Router | 在ts文件中负责跳转路由操作 | Router.navigate([“/xxx”]),Router.navigateByUrl(“/xxx”) |
routerLink | 在html中使用页面跳转 | <a [routerLink]="['/xx']" |
routerLinkActive | 表示当前激活路由的样式 | routerLinkActive=”active” |
ActivedRoute | 获取当前激活路由的参数, | 这个是一个类,要实例化,使用实例化后的对象.params,xx.queryParams |
redirectTo | 重定向 | redirectTo=”/路径” |
useHash | 使用哈希值展现 | {useHash:true} |
pathMatch | 完全匹配 | pathMatch:”full” |
angular4路由设置笔记的更多相关文章
- golang学习笔记6 beego项目路由设置
golang学习笔记5 beego项目路由设置 前面我们已经创建了 beego 项目,而且我们也看到它已经运行起来了,那么是如何运行起来的呢?让我们从入口文件先分析起来吧: package main ...
- ICBC中的路由设置
才去的中国工商银行,用身份证叫了A0076的号,前边还有26个人,闲来无聊果断拿出手机收取wifi.有两个ssid为ICBC的路由,信道分别是1号和6号,还好不需要密码,不过一会就连接上了. 那我先上 ...
- Controller里写自己需要的Action,参数的名字必须和路由设置的参数名一致
Controller里写自己需要的Action,参数的名字必须和路由设置的参数名一致,如果参数不一致,传过去为null
- xp多网卡静态路由设置方法
xp多网卡静态路由设置方法 一.多个IP都在同一网段或VALN.这类情况没什么好说的,在各块网卡的本地连接属性里设置好IP地址.子网掩码和默认网关即可. 二.多个IP属于不同网段或VLAN.这时如果按 ...
- MVC3.0,路由设置实现伪静态IIS中404错误
C# code? 1 2 3 4 5 routes.MapRoute("NewQueryTest.asp", "NewQueryTest ...
- express中路由设置的坑-----1
router.get('/commodities/sortable', utils.logged, function (req, res) { Commodity.find({force_top:tr ...
- Sublime Text 3设置笔记
Sublime Text 3设置笔记 Sublime Text 3设置指南 1. 安装package control 下载package control源码安装包,并解压: http://yun.ba ...
- CI 路由设置
$route['news/show/(:num)']='news/show/$1'; 前边是匹配 网址 后边是 指定控制器 在application/config/文件夹下有routes.p ...
- angualr4 路由 总结笔记
使用cli命令创建根路由模块 ng g cl app.router 或自己建一个路由配置文件 如:app/app.router.ts // app/app.router.ts // 将文件修改为 im ...
随机推荐
- Go:定时执行任务time.sleep和time.tick的优劣
golang 写循环执行的定时任务,常见的有以下三种实现方式:1.time.Sleep方法: for { time.Sleep(time.Second) fmt.Println("我在定时执 ...
- Tomcat热部署的实现原理
Tomcat热部署机制 对于Java应用程序来说,热部署就是在运行时更新Java类文件.在基于Java的应用服务器实现热部署的过程中,类装入器扮演着重要的角色.大多数基于Java的应用服务器,包括EJ ...
- 自定义标签报 无法为TAG [my2:hello]加载标记处理程序类[null]
今天练习jsp自定义标签的时候,等我写好全部和检查万无一失的时候.执行然后报错了 无法为TAG [my2:hello]加载标记处理程序类[null] 我反复检查代码,发现代码也没什么问题.后面通过百度 ...
- 用户与授权:MySQL系列之六
一.用户管理 1.用户账号 用户的账号由用户名和HOST俩部分组成('USERNAME'@'HOST') HOST的表示: 主机名 具体IP地址 网段/掩码 可以使用通配符表示,%和_:192.168 ...
- QPS,TPS,吞吐量,响应时间详解及关系
并发数 并发数是指系统同时能处理的请求数量,这个也是反应了系统的负载能力 吞吐量吞吐量是指单位时间内系统能处理的请求数量,体现系统处理请求的能力,这是目前最常用的性能测试指标 响应时间RT(Respo ...
- 论js里面的for循环
首先搞懂执行的顺序: 对,执行顺序就是这样的. for循环的作用: 1.在编写代码时,你常常希望反复执行同一段代码. 2.遍历数组,可以用forEach();对于DOM对象(nodelist)的话,比 ...
- LeetCode 148 Sort List 链表上的归并排序和快速排序
Sort a linked list in O(n log n) time using constant space complexity. 单链表排序----快排 & 归并排序 (1)归并排 ...
- hadoop map 个数 源码分析
本文转自http://ronxin999.blog.163.com/blog/static/42217920201279112163/
- Zookeeper启动失败:java.net.BindException: Address already in use
错误日志如下: [hadoop@master zookeeper-3.4.5-cdh5.10.0]$ cat zookeeper.out 2018-05-15 01:29:21,036 [myid:] ...
- Windows下 bat调用TSql问题
一.建立sql文件 在sql管理工具中写好sql文件,并保证能够正常运行,之后用unique编码保存. 二.建立一个bat文件osql -U登录用户 -P密码 -S服务器 <sql文件.sql ...