zoukankan      html  css  js  c++  java
  • angular(4)路由及其使用

    安装好路由根ts文件会出现app-routing.module.ts,在里面引入需要配置的组件模块,并在const routes:Routes中配置好路由,path为显示组件的路径,component为引入的组件模块,当需要默认展示某个组件时使用{path:'**',redirectTo:'需要默认展示的组件路径'},默认路由需放在配置路由的最后面

    跳转路由时使用routerLink进行路由跳转 ,在路由跳转后添加routerLinkActive='类名',当点击添加这个属性的标签时,会给当前标签添加定义的类名

        get传值:   ①。在接收值的组件内引入路由模块   import { ActivatedRoute } from '@angular/router'; 

              ②.声明模块 constructor(public route:ActivatedRoute) { }

              ③.获取值     this.route.queryParams.subscribe((data)=>{console.log(data)})

                  动态路由传值:①.在app-routing.module中配置动态路由  {path:'Newscontent/:aid',component:NewscontentComponent},

              ②.跳转传值

                ③.接收值:   

                    在接收组件内引入路由模块    import { ActivatedRoute } from '@angular/router';

                    声明模块   constructor(public route:ActivatedRoute) { }

                    获取值 this.route.params.subscribe((data)=>{console.log(data) })

    路由嵌套 : 

  • 相关阅读:
    Shell 脚本读取文件中的每行
    Linux中的内存管理机制
    CPU Cache 学习(一)
    linux系统层次(转)
    linux下的一些常用命令
    几个关于Linux进程fork()的题目
    GDB调试工具
    POSIX thread library 简介I
    Scheme Programming language II
    Google Chrome浏览器标签页之间的自动切换
  • 原文地址:https://www.cnblogs.com/ttaoai/p/13358917.html
Copyright © 2011-2022 走看看