Angular跳转传值(get,动态路由,js)
2021-01-24 14:15
标签:str bsp lin const ext oge tor navig ons 一,get传值 传 接收 二,动态路由传值 配置 跳转 接收 三、动态路由的js跳转 1, 引入 2.初始化 跳转 四,js get传值 Angular跳转传值(get,动态路由,js) 标签:str bsp lin const ext oge tor navig ons 原文地址:https://www.cnblogs.com/zhulei2/p/13252051.htmlul *ngFor="let l of list;let ss=index;">
li>a routerLink="/newsDetail" [queryParams]="{aid:l.id}">{{l.content}}a>li>
ul>
import { ActivatedRoute } from ‘@angular/router‘;
constructor(public router:ActivatedRoute) { }
//get获取传值
this.router.queryParams.subscribe((data)=>{
console.log(data)
})
{
path:‘newsDetail/:id‘,component:NewDetailComponent
}
ul *ngFor="let l of list;let ss=index;">
li>a [routerLink]="[‘/newsDetail‘,l.id]">{{l.content}}a>li>
ul>
import { ActivatedRoute } from ‘@angular/router‘;
constructor(public router:ActivatedRoute) { }
//动态路由
this.router.params.subscribe((data)=>{
console.log(data)
this.id=data.id;
})import { Router } from ‘@angular/router‘;
export class HomeComponent implements OnInit {
constructor(private router: Router) {}
}
button (click)="goHome()">goHomebutton>
import { Router } from ‘@angular/router‘;
//js跳转
goHome(){
//传值
//this.router.navigate([‘/home‘,‘1‘])
//不传值
this.router.navigate([‘/home‘])
}
button (click)="goGetHeader()">goGetHeaderbutton>
import { Router,NavigationExtras } from ‘@angular/router‘;
constructor(public router:Router) { }
goGetHeader(){
let queryParams:NavigationExtras={
queryParams:{‘id‘:12}
}
this.router.navigate([‘/header‘],queryParams)
}
下一篇:nodejs读写yaml
文章标题:Angular跳转传值(get,动态路由,js)
文章链接:http://soscw.com/index.php/essay/46358.html