Angular2素数数据表所选行使用路由器传递给其他组件
我有一个素数数据表,我想通过路由器将选定的行传递给其他页面。例如:我有一个学生数据表,当我选择一个学生行并单击提交按钮时,它应该在StudentDetails页面中显示详细信息 在这里,我可以选择行并将数据传递给student组件。但无法将数据传递给学生详细信息组件Angular2素数数据表所选行使用路由器传递给其他组件,angular,angular2-routing,primeng,Angular,Angular2 Routing,Primeng,我有一个素数数据表,我想通过路由器将选定的行传递给其他页面。例如:我有一个学生数据表,当我选择一个学生行并单击提交按钮时,它应该在StudentDetails页面中显示详细信息 在这里,我可以选择行并将数据传递给student组件。但无法将数据传递给学生详细信息组件 export class Student { selectedRow:Student;// I can able to assign selected row here navigateStudentDetail(){ thi
export class Student {
selectedRow:Student;// I can able to assign selected row here
navigateStudentDetail(){
this.router.navigate(['./studentdetail']);
}
我可以使用query参数传递studentId,但我想将我的student对象传递给studentdetails组件。但是做不到
有什么简单的方法可以做到这一点吗?请帮助我使用一个服务只是将一些参数传递给另一个组件可能有些过分。您可以使用NavigationExtras添加自定义数据以及要导航到的Url
import { NavigationExtras} from '@angular/router';
//You will need navigations extras from Router.
在组件中的某个地方
let dataNav:NavigationExtras={queryParams:"somekey":"someValue",
"someOtherKey":"someOtherValue"}};
this.router.navigate(['/path/whatever/'],dataNav);
import { Router, ActivatedRoute, Params } from '@angular/router';
//you will need something like this
ngOnInit() {
this.route.queryParams
.subscribe(params =>{
this.someOtherKeyReceived=params['someOtherKey']
});
然后在目标组件中
let dataNav:NavigationExtras={queryParams:"somekey":"someValue",
"someOtherKey":"someOtherValue"}};
this.router.navigate(['/path/whatever/'],dataNav);
import { Router, ActivatedRoute, Params } from '@angular/router';
//you will need something like this
ngOnInit() {
this.route.queryParams
.subscribe(params =>{
this.someOtherKeyReceived=params['someOtherKey']
});
在构造函数中实例化ActivatedRoute,如下所示
constructor(
private route: ActivatedRoute,
private router: Router){}
最后获取第一个组件发送的参数
let dataNav:NavigationExtras={queryParams:"somekey":"someValue",
"someOtherKey":"someOtherValue"}};
this.router.navigate(['/path/whatever/'],dataNav);
import { Router, ActivatedRoute, Params } from '@angular/router';
//you will need something like this
ngOnInit() {
this.route.queryParams
.subscribe(params =>{
this.someOtherKeyReceived=params['someOtherKey']
});
}我使用提供商解决了这个问题。林克帮了我很多。谢谢