1、get傳值

1.跳轉(zhuǎn)

<!-- get傳值 -->
<a [routerLink]="[ '/newscontent' ]" routerLinkActive="active">新聞詳情</a>
<ul>
  <li *ngFor="let item of list ;let key=index">
    <!-- 遍歷后，在路由連接后面加上key值 -->
    <a [routerLink]="['/newscontent']"  [queryParams]="{aid:key}">
{{key}}---{{item}}</a>
  </li>
</ul> 

2.接收

import { ActivatedRoute } from '@angular/router'  

constructor(public route: ActivatedRoute) {}
  //打印路由對(duì)象
  console.log(this.route.queryParams)
  this.route.queryParams.subscribe(data => {
  console.log(data)
 })

2、動(dòng)態(tài)傳值

1.配置路由

{ path: 'newscontent/:aid', component: NewscontentComponent }

2.跳轉(zhuǎn)

<!-- get傳值 -->
<ul>
  <li *ngFor="let item of list ;let key=index">
    <a [routerLink]="['/newscontent'，key]">
{{key}}---{{item}}</a>
  </li>
</ul> 

3.接收

import { ActivatedRoute } from '@angular/router'  

constructor(public route: ActivatedRoute) {}
  this.route.query.subscribe(data => {
  console.log(data)
 })

3.js跳轉(zhuǎn)路由

1.動(dòng)態(tài)路由

1.引入聲明模塊

import { Router } from '@angular/router'
constructor(public router: Router) {}

2.跳轉(zhuǎn)

this.router.navigate(['productcontent'])
<!-- 動(dòng)態(tài)的“1234”變成 key ，不用加引號(hào)-->
this.router.navigate(['/productcontent/', '1234'])

2.get傳值

1.引入聲明模塊

import { Router, NavigationExtras } from '@angular/router'
constructor(public router: Router) {}

2.跳轉(zhuǎn)

<!-- 通過(guò)goNewsContent() 函數(shù)，傳入對(duì)象-->
goNewsContent() {
  let queryParams = {
  queryParams: { aid: 3 }
}
this.router.navigate(['news'], queryParams)

}