Angular 6 Http服务最佳实践

Question

我有一个在Angular中调用REST端点并返回EntryDTO列表的Feed服务。以下是该服务的示例代码：

@Injectable({providedIn: 'root'})

constructor(private http: HttpClient) {}
export class FeedService() {
  getPublicFeedEntries: Observable<EntryDTO[]> () {
    return this.http.get('/rest/publicFeedEntries/).map((response: Response) => response.json()).catch((err: any) => Observable.throw(error.josn().error || 'error');
  }
}

那么我可以有一个订阅这个可观察对象的反馈组件：

export class FeedComponent() {
private feedEntries: EntryDTO[];
constructor(private feedService: FeedService) { feedEntries = new Array(); }

ngOnInit() {
  this.feedService.getPublicFeedEntries.subscribe(entries => {
  this.feedEntries = entries;
  }, err => {console.log(err) })
 }
}

将Observable返回到服务中并在组件中订阅，这是否被认为是最佳实践？还有其他的最佳实践吗？

- ItFreak

---

通常，服务返回观察者对象(Observables)，在组件中我们订阅这些观察者。注意：如果您使用httpClient，请勿使用map(res=>res.json()。您不需要这样做。 - Eliseo

我该如何获取JSON表示形式呢？否则我就无法将响应分配给我的数组，对吧？ - ItFreak

HttpClient默认直接提供JSON对象。(使用console.log(res)进行检查) - Eliseo

你还应该考虑使用.pipe(takeUntil( /* Subject */))。我通常会有一个属性destroyed$: Subject<void> = new Subject<void>();，并在ngOnDestroy钩子中调用this.destroyed$.next()。这将在组件销毁时停止订阅，并停止任何可能影响性能的订阅泄漏。 - Baruch

@ItFreak，是的，你做错了。在这篇文章中，你可以了解更多相关信息。 - Baruch

Answer 1

你所采用的方法是完全可行的，但是如果引入模型到你的服务中，可以将其提升到一个新的水平，这将使响应在组件中更易于阅读和使用。

请查看ngx-model上的文章，该文章提供了一种在应用程序中遵循模型驱动方法的方式。

- Kedar9444