如何在角度分量中获取/使用id im路由？
提问于 2022-09-20 03:30:34
这也是我第一次接触JS，所以我想我的问题是非常基本的。我有一个主视图，在这里我显示了许多元素，在本例中，每个元素都是可点击的，并引用到电影的详细视图。我现在的问题是如何处理我传递给组件ts文件中的详细视图的id？最后，我需要这个ID来获取实际电影对象的API？！
这是我的详细视图的当前代码：
export class MovieDetailComponent implements OnInit {
public movie: MovieResponse[] = []
constructor(private http: HttpClient, private sanitizer: DomSanitizer) { }
async ngOnInit(): Promise<void> {
const movie = await firstValueFrom(this.http.get<[MovieResponse]>(environment.backend + '/api/v1/movie/'+ this.route.snapshot.paramMap.get('id')));
this.movie = await Promise.all(movie.map(async (movie) => {
movie.cover_url = <string>this.sanitizer.bypassSecurityTrustResourceUrl(URL.createObjectURL(await firstValueFrom(this.http.get(movie.cover_url, {responseType: 'blob'}))));
return movie;
}));
}
}由于某些原因，我无法解决这个问题：this.route.snapshot.paramMap.get('id')。在这里需要做些什么才能使用我传递的身份证？
基本上，流程如下：
<div [routerLink]="['movie', movie.id]">->引用我的应用程序-routing.module.ts中的详细视图- ，该组件集成如下，用于详细视图：
连接路由:路由=[{ path：''，canActivate: AuthGuard，子路径：{ path：''，组件: MediaComponent }，.还会有更多的东西。{路径：“电影/:id”，组件: MovieDetailComponent }} ];
回答 2
Stack Overflow用户
回答已采纳
发布于 2022-09-20 03:40:17
import ActivatedRoute from '@angular/router'在组件构造函数中，编写如下：
public actRoute: ActivatedRoute 然后，您可以使用变量访问传递的id，例如：
const id = this.actRoute.snapshot.params.idStack Overflow用户
发布于 2022-09-20 04:28:42
怎样才能达到你想要的价值。试试这边。
export class MovieDetailsComponent implements OnInit {
movie$!: Observable<Movie>;
enter code here
constructor(
private service: HeroService,
private route: ActivatedRoute
) {}
ngOnInit() {
this.movie$ = this.route.paramMap.pipe(
switchMap(params => {
const id = params.get('id'));
return this.service.getMovieDetails(id);
})
);
}
}参考文献角官方文档：https://angular.io/guide/router-tutorial-toh#route-parameters-in-the-activatedroute-service
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/73785998
复制相关文章
点击加载更多
腾讯云开发者
