Question

使用resolver服务或在OnInit挂钩中获取数据有什么用？例如，如果我需要从3个不同的源获取数据到1页更好的用户解析器或将代码写入ngOnInit？

码

ngOnInit() {
service1.getData().subscribe(c => {
    this.data1 = c;
});
service2.getData().subscribe(c => {
    this.data2 = c;
});
service3.getData().subscribe(c => {
    this.data3 = c;
});
}

OR

RouterModule.forRoot([
  {path: 'page/:id', component: blabla, resolve: {
    data1: service1,
    data2: service2,
    data3: service3
  }}
])

ngOnInit() {
this.data1 = this.activatedRoute.snapshot.data.data1;
this.data2 = this.activatedRoute.snapshot.data.data2;
this.data3 = this.activatedRoute.snapshot.data.data3;
}

Answer 1

resolvers和onInit之间的主要区别在于同步性。

Resolver是同步的。
- 您应该在加载组件之前需要数据时使用它。
- 您阻止组件加载。
- 您不会将服务注入组件（您不能使用其他方法）
OnInit是异步的（在您的代码中）。
- 在加载组件之前，如果不需要数据，则应使用它。
- 您不会阻止组件加载。
- 您将服务注入组件，因此您可以使用此服务中的其他方法。

请查看此网站：https://blog.thoughtram.io/angular/2016/10/10/resolving-route-data-in-angular-2.html

Answer 2

这取决于。如果组件在没有data1，data2和data3的情况下无法运行，那么解决方法很有意义。一个例子是您的银行帐户页面。在您看到帐户的详细信息之前，您并不关心该页面。

如果您在等待数据时向用户显示某些内容，则最好在ngOnInit中获取数据。一个示例是产品页面，其中data{1,2,3}是推荐产品的流。即使没有建议，产品页面仍然可以显示，并且推荐的产品可以继续加载，同时用户可以与页面的其余部分进行交互。

如果没有更深入地了解您的业务逻辑要求，任何人都很难回答这个问题。

Answer 3

重要的是要了解route resolvers和component ngOnInit是针对两个不同问题的两种不同解决方案，这意味着一种工具并不比另一种更好。

我想说，最佳实践是根据情况在您的应用程序中同时使用-有时，从UX角度讲，同步显示视图（阻塞直到加载数据）是有意义的，而有时最好显示立即查看并异步加载数据。

因此，这不是应用程序设计或体系结构决策，而是UX / UI决策。

角度路线解析器或onInit？

3 个答案: