[Angular2 Router] Configure Auxiliary Routes in the Angular 2 Router - What is the Difference Towards a Primary Route?
In this tutorial we are going to learn how we can can configure redirects in the angular 2 router configuration. We are also going to see again another example on how the order of the configuration might trip us. We are going to see the different between path matching in prefix mode vs full mode, and we are going to learn why redirects should be in general configured using full path matching.
Define a auxiliary router in app.routes.ts:
{path: 'wiki-path', loadChildren: 'app/auxroute/auxroute.module', name: 'WikiDetail', outlet: 'wiki'},
app.component.html:
<router-outlet class="main"></router-outlet>
<router-outlet name="wiki" class="right-detail"></router-outlet>
The main difference between noraml router outlet and auxiliary router is auxiliary router has name prop.
url for auxiliary router:
http://localhost:4200/home(wiki:wiki-path)
it contains: (<outlet_name>:<path_name>)

[Angular2 Router] Configure Auxiliary Routes in the Angular 2 Router - What is the Difference Towards a Primary Route?的更多相关文章
- [Angular2 Router] Auxiliary Routes bit by bit
Article Github Auxiliary Routes is is little bit hard to understand. Here is demo, link You can see ...
- [Angular 2 Router] Configure Your First Angular 2 Route
Using the Angular 2 router requires defining routes, passing them in to the RouterModule.forRoot and ...
- angular当router使用userhash:false时路由404问题
angular当router使用userhash:false时路由404问题 安装iis urlrewrite2.0组件 在根目录下创建 Web.config <configuration> ...
- [Angular 2] Router basic and Router Params
When we define router in Angualr 2, we use @RouteConcfig() When we want to display component, we use ...
- angular 4 router传递数据三种方法
1.在查询参数中传递数据 <a [routerLink]="['/product']" [queryParams]="{id:1,name:'dongian'}& ...
- angular ui.router 路由传参数
angular已经用了一段时间了,最近在做路由,做一下笔记. 路由跳转的时候进行穿参 ui.router方式 <a ui-sref="edit({id:5})"> 编辑 ...
- [Angular] Enable router tracing
To enable router tracing is really simple: RouterModule.forRoot(ROUTES, { enableTracing: true }) Whe ...
- 规范 : angular ui router path & params
在seo文章中提到url的path 必须是 why-us,而不是whyUS 所以定了规范,所有的path 必须why-us path ?后尾的是用来filter的,所以可以WhyUs 如果是不需要给s ...
- Vue Router的官方示例改造
基于Vue Router 2018年8月的官方文档示例,改造一下,通过一个最简单的例子,解决很多初学者的一个困惑. 首先是官方文档示例代码 <!DOCTYPE html> <html ...
随机推荐
- 从头认识Spring-2.4 基于java的标准注解装配-@Inject(2)-通过set方法或者其它方法注入
这一章节我们来讨论一下基于java的标准注解装配标签@Inject是如何通过通过set方法或者其它方法注入? 在使用@Inject标签之前.我们须要在pom文件中面增加以下的代码: <depen ...
- Linux-----Ubuntu Server安装图形界面
watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/ ...
- es64 const
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 基于Linux平台Softimage XSI 演示
2009年底上映的<阿凡达>是电影特效的巅峰之作,就在本月初上映的变形金刚3每次观看之后看得眼花缭乱总能让我热血沸腾,要是自己能做出那样的特效该多好,Linux下研究Maya已经有一段日 ...
- Kinect 开发 —— Kinect for windows SDK
开发 —— 基本的SDK和Windows 编程技巧(彩色图像视频流,深度图像视频流的采集,骨骼跟踪,音频处理,语音识别API) 深度数据,就是Kinect的精髓和灵魂,很多问题都转换为深度图像的模式识 ...
- RPC简易学习
0.RPC简介 RPC, 英文全称:Remote Process Call. 中文全称:远程过程调用. 客户端通过网络请求调用远程服务端对外暴露服务.常用的两种RPC协议:TCP.HTTP. ...
- watch---周期性的方式执行给定的指令
watch命令以周期性的方式执行给定的指令,指令输出以全屏方式显示. 选项 -n:指定指令执行的间隔时间(秒): -d:高亮显示指令输出信息不同之处: -t:不显示标题.
- ubuntu 进入临时客户会话页面 转入用户自己页面
1.点击右上角的按钮 2.选择要登录的客户名字 点击进入 3.输入账号密码 进入指定的账号
- python爬虫之『入门基础』
HTTP请求 1.首先需要了解一下http请求,当用户在地址栏中输入网址,发送网络请求的过程是什么? 可以参考我之前学习的时候转载的一篇文章一次完整的HTTP事务过程–超详细 2.还需要了解一下htt ...
- JavaScript学习总结(9)——JS常用函数(一)
本文中,收集了一些比较常用的Javascript函数,希望对学习JS的朋友们有所帮助. 1. 字符串长度截取 ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 1 ...