AngularJs之路由配置(二)

1.参数订阅

我们使用 <a [routerLink]="['/prouct',1]" >商品详情</a>

跳转到product页面获取参数的值,我们需要使用参数订阅。

在procuct ts中private productid:number; 

声明一个number的变量

在oninit()中使用参数订阅:

this.info.params.subscribe((params:Params)=> this.productid=params["id"]);
我们就可以在html页面使用差值表达式获取参数的值

 商品id:{{productid}}

2.监听事件跳转路由

很多时候我们需要使用按钮跳转,当然在按钮中我们同样可以使用 [routerLink]进行跳转

如果使用onclick的话 可以使用

(click)="xinxi()" xinxi是方法名在对应的ts中


若要传参则:


最后,使用参数订阅和监听事件跳转路由需要声明

info:ActivatedRoute
 
 

猜你喜欢

转载自blog.csdn.net/huangliniqng/article/details/78504990