【ionic4】路由跳转
·
什么是路由?
很多地方都见到过路由,也都听过路由。
路由是指分组从源到目的地时,决定端到端路径的网络范围的进程。【来自百度百科】
例如:(路由配置)
{ path: 'awardrulesgrade', loadChildren: './awardrules/awardrulesgrade/awardrulesgrade.module#AwardrulesgradePageModule' },
普通路由跳转
通过组件中使用:[routerLink]="[’/routePath’]" ,将routePath改为自要跳转的路由地址。
例如:
<ion-button [routerLink]="['/tabs/tab1']" expand="full">
确定
</ion-button>
路由跳转传值(get传值)
-
就是用这个:[queryParams]="{}",“{}”这里面填写需要传递的值。可以固定的数值,也可以通过变量的形式传递。
例如:(以变量的形式显示的传值)<ion-item *ngFor="let item of gadeList" [routerLink]="['/awardrulesgrade']" [queryParams]="{id:item.id, Name:item.Name}"> <ion-label>{{item.Name}}</ion-label> </ion-item> -
NavController
引入代码:import { NavController } from '@ionic/angular';声明:
constructor(public nav: NavController) { }参数传递:
this.nav.navigateForward(['/addawardrules'], { queryParams: { organizationId: this.organizationId, OrganizationName: this.organizationName, checkState: this.checkState } });
那么如何接收数据呢?
-
引用下面的代码
import { ActivatedRoute } from '@angular/router'; -
声明如下
constructor( public activatedRoute: ActivatedRoute) { } -
获取get传值
ngOnInit() { // 获取get传值 this.activatedRoute.queryParams.subscribe((result) => { this.id= result.id; }); }
更多推荐



所有评论(0)