zoukankan      html  css  js  c++  java
  • angular 路由

    在路由时传递数据

    1. 在查询参数中传递数据

    /product?id=1&name=2 => ActivatedRoute.queryParams[id]

    2.在路由路径中传递数据

    {path:/product/:id} => /product/1 => ActivatedRoute.params[id]

    3. 在路由配置中传递数据

    {path:/product, component: ProductComponent, data:[{isProd:true}]} => ActivatedRoute.data[0][isProd]

     重定向路由

    const routes:Routes = [
        {path: '', redirectTo: '/home', pathMatch: 'full'}   
    ]

    子路由<router-outlet></router-outlet>

    {path:'home',component:HomeComponent,
        children:[
          {path:'',component:XxxComponent},
          {path:'/yyy', component:YyyComponent}
      ]
    }

    辅助路由

    <router-outlet></router-outlet>
    <router-outlet name="aux"></router-outlet>
    {path: 'xxx',component:XxxComponent,outlet:'aux'}
    {path: 'yyy',component:YyyComponent,outlet:'aux'}
    <a [routerLink]="['/home',{outlets:{aux:'xxx'}}]">Xxx</a>
    <a [routerLink]="['/product',{outlets:{aux:'yyy'}}]">Yyy</a>

    路由守卫

    CanActivate:处理导航到某路由的情况
    CanDeactivate:处理从当前路由离开的情况
    Resolve:在路由激活之前获取路由数据
  • 相关阅读:
    apache多端口映射
    mark
    一些注册表值
    jsp URL中文处理的几种方式
    【引用】雨林木风Ghost XP SP3系统
    CentOS常用命令
    查看ie8临时文件夹
    卡塔兰数
    大数问题
    不会做的题目
  • 原文地址:https://www.cnblogs.com/leiting/p/8384947.html
Copyright © 2011-2022 走看看