在角度8中，从服务使用数据的最佳实践是什么？ [英] What is the best practice in Angular 8 to consume data from service?

问题描述

我有一个应用程序，所有的状态管理架构都是作为可观察的数据服务实现的。我试图弄清楚的是，创建共享列表和词典的最佳方式是什么，这些共享列表和词典将通过服务提供。我知道这听起来很简单--但由于我是角度8的新手--我仍然不能理解rxjs的所有最佳实践。

为了说明我的问题-这里是一个服务，一个用户列表，我希望它只使用一次数据(作为单一实例)，并能够通过组件轻松获取

export class ApiService {

 public users =  new BehaviorSubject<any>({‘users’: []});

 constructor(private http: HttpClient}

 public getUsers(){
   return this.http.get(‘/users’).subscribe((res)=>{this.users.next(res)})
 }
}

下面是我使用用户列表的方式

export class UsersComponent implements OnInit {

public usersList: BehaviorSubject<any>;

  constructor(public apiService:ApiService) {

    this.usersList = new BehaviorSubject<any>([]);
    this.apiService.users.subscribe((value: any) => {
           
      this.usersList.next(value);
     
    });
  }
}

现在，我不确定这是不是正确的方式--因为逻辑似乎在组件和服务中都重复了……(在这一点上我可能错了……)更详细地说，用户列表应该是一个静态数据，应该只实例化一次。

推荐答案

对于如何处理角度组件之间的数据，答案是：使用服务

https://angular.io/guide/architecture-services

ANGLE团队维护了一个名为Tour of heroes的非常好的教程，在该教程中，他们为开发人员提供了对ANGLE体系结构及其主要数据工作流的很好的介绍。我特别推荐大家完成last chapter，这是关于数据处理的。

要回答您的问题，总而言之，您不应该从服务订阅到端点的调用。在您的服务中，创建如下函数：

...
public getUsers(){
   return this.http.get(‘/users’)
 }
...

在您的组件中创建服务数据的Observables如下：

export class UsersComponent implements OnInit {
...
public usersList$ = this.apiService.getUsers();

...
}

并且在其组件模板上(请注意那里的async pipe)，当您使用适当的管道时，ANGLE将为您进行订阅： (我假设您的用户模型上有姓名和电子邮件属性，只是为了显示数据)

<div *ngFor="let user of usersList$ | async">
  <div> {{ user.name }} </div>
  <div> {{ user.email }} </div>
</div>

这篇关于在角度8中，从服务使用数据的最佳实践是什么？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！