angular路由详解五(辅助路由)
在HTML文件中
//主路由
<router-outlet></router-outlet>
//辅助路由
<router-outlet name="aux"></router-outlet>
配置
{path:'xxx',component:XxxComponent}
{path:'yyy',component:YyyComponent,outlet:"aux"}
<a [routerLink] = "['/xxx',{outlet:{aux:'xxx'}}]">Xxx</a>
<a [routerLink] = "['/yyy',{outlet:{aux:'yyy'}}]">Yyy</a>
//primary 决定主路由的路径 点击a标签主路由到Zzz组件,辅助路由到Yyy组件
<a [routerLink] = "['/yyy',{outlet:{primary:‘zzz’ aux:'yyy'}}]">Yyy</a>
angular路由详解五(辅助路由)的更多相关文章
- angular路由详解六(路由守卫)
路由守卫 CanActivate: 处理导航到某个路由的情况. CanDeactivate:处理从当前路由离开的情况. Resole:在路由激活之前获取路由数据. 1.CanActivate: 处理导 ...
- angular路由详解三(路由参数传递)
我们经常用路由传递参数,路由主要有三种方式: 第一种:在查询参数中传递数据 {path:"address/:id"} => address/1 => Activa ...
- react router @4 和 vue路由 详解(五)react怎么通过路由传参
完整版:https://www.cnblogs.com/yangyangxxb/p/10066650.html 7.react怎么通过路由传参? a.通配符传参(刷新页面数据不丢失) //在定义路由的 ...
- react router @4 和 vue路由 详解(一)vue路由基础和使用
完整版:https://www.cnblogs.com/yangyangxxb/p/10066650.html 1.vue路由基础和使用 a.大概目录 我这里建了一个router文件夹,文件夹下有in ...
- react router @4 和 vue路由 详解(八)vue路由守卫
完整版:https://www.cnblogs.com/yangyangxxb/p/10066650.html 13.vue路由守卫 a.beforeEach 全局守卫 (每个路由调用前都会触发,根据 ...
- react router @4 和 vue路由 详解(七)react路由守卫
完整版:https://www.cnblogs.com/yangyangxxb/p/10066650.html 12.react路由守卫? a.在之前的版本中,React Router 也提供了类似的 ...
- Ocelot简易教程(三)之主要特性及路由详解
作者:依乐祝 原文地址:https://www.cnblogs.com/yilezhu/p/9664977.html 上篇<Ocelot简易教程(二)之快速开始2>教大家如何快速跑起来一个 ...
- Vue 路由详解
Vue 路由详解 对于前端来说,其实浏览器配合超级连接就很好的实现了路由功能.但是对于单页面应用来说,浏览器和超级连接的跳转方式已经不能适用,所以各大框架纷纷给出了单页面应用的解决路由跳转的方案. V ...
- elasticsearch系列三:索引详解(分词器、文档管理、路由详解(集群))
一.分词器 1. 认识分词器 1.1 Analyzer 分析器 在ES中一个Analyzer 由下面三种组件组合而成: character filter :字符过滤器,对文本进行字符过滤处理,如 ...
随机推荐
- 使用域账号统一管理cisco网络设备
1.思科设备和微软系统整合的背景: 公司内部有一定数量的客户端,为了实现统一化,在管理内部部署了域架构,这样可以通过组策略对客户端进行批量化管理,提高了管理的效率. 同样公司内部有一定数量的网络设备( ...
- 解决CXF的java.io.FileNotFoundException: class path resource [META-INF/cxf/cxf-extension-soap.xml] cannot be opened because it does not exist
以下是错误信息 九月 25, 2017 8:22:04 下午 org.springframework.web.context.support.XmlWebApplicationContext prep ...
- laravel框架基础知识点
一.数据库:DB 1.db查 DB::table('msg')->where('id','>',$id)->get() 查询单行 DB::table(' ...
- 利用fiddler和mock调试本地微信网页
利用fiddler和mock调试本地微信网页 微信公众号网页是比较特殊的页面,普通页面直接打开即可访问,但对于需要请求微信相关接口的部分需要安全域名认证.这导致了使用mock数据进行开发的页面没办法走 ...
- Spring中的@scope注解
默认是单例模式,即scope="singleton".另外scope还有prototype.request.session.global session作用域.scope=&quo ...
- Mysql根据指定字段的int值查出在当前列表的排名
先看表结构和数据: DROP TABLE IF EXISTS `ndb_record`; CREATE TABLE `ndb_record` ( `id` bigint(20) NOT NULL AU ...
- scrapy的学习总结(1)
1.xpath和css的节点的共同结合使用是一个挺好的使用过程,还有就是配合正则表达式的使用,这个也是很重要的.解决任何一个问题都会有不同方法.学会思考的解决问题. 2.item的数据抽取,pipel ...
- Centos安装jdk8
1.下载jdk1.8的tar cd /usr/local/src #切换到该目录下 wget url #下载jdk8的tar包 2.下载完成后解压tar包 tar -zxvf jdk-8u152-li ...
- windowsXP下搭建JAVA环境教程
一.工具准备安装JKD6:传送门:http://www.java.net/download/jdk6/6u10/promoted/b32/binaries/jdk-6u10-rc2-bin-b32-w ...
- VC6安装错误——Error Launching acmboot.exe
因项目需要,我需要安装Microsoft Visual C++ Professional Version 6 SP5.但是在安装时运行安装目录下的setup.exe,出现Error Launching ...