问题描述
我有一个组件,可以在其中选择一组图像对象。我想将这些选定的图像传递到我的新路线CreateAlbum。它嵌套的数据不适合作为URL参数传递。
I have a component where I select a set of image objects. I want to pass these selected images to my new route, CreateAlbum. The data it nested and wouldn't be suitable to pass as URL parameters.
有没有简单的方法来实现这一目标?
Is there any easy way to achieve this?
这是我的代码以导航至路线
Here's my code to navigate to the route
public gotoCreateAlbum(): void {
this.router.navigate([('/create-album')])
}
我选择的数据位于此变量中
My selected data sits in this variable
@Input() selectedPhotos: IPhoto[];
这是我的路由模块
const routes: Routes = [
{ path: 'photos', component: PhotosComponent},
{ path: 'photos/:filter', component: PhotosComponent},
{ path: 'create-album', component: CreateAlbumComponent}
];
基本上,我想执行相同的操作,就像CreateAlbum组件是我当前组件中的子组件一样在哪种情况下我会使用@Input()
Basically I want to perform the same operations as if the CreateAlbum component was a child to my current component in which case I would have used @Input()
推荐答案
请参见以获得更深入的示例。向下滚动到以下代码段:
See https://angular.io/guide/router for an in-depth example. Scroll down to this code snippet:
gotoHeroes(hero: Hero) {
let heroId = hero ? hero.id : null;
// Pass along the hero id if available
// so that the HeroList component can select that hero.
// Include a junk 'foo' property for fun.
this.router.navigate(['/heroes', { id: heroId, foo: 'foo' }]);
}
在目标组件中获取 id的值:
To get the value of 'id' in the target component:
ngOnInit() {
this.heroes$ = this.route.paramMap.pipe(
switchMap((params: ParamMap) => {
// (+) before `params.get()` turns the string into a number
this.selectedId = +params.get('id');
return this.service.getHeroes();
})
);
}
这篇关于通过Angular2路由器传递数据的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!