Angular 5-将组件变量设置为Observable类型有什么好处?

时间:2018-08-27 13:32:38

标签: angular typescript http observable

我是 Angular 6的新手,并在以下链接中了解了http流程:

https://angular.io/tutorial/toh-pt6#create-herosearchcomponent

我注意到在组件中,heroes数组的类型为Observable

我不确定组件内部是否总是需要这种情况。

在我自己的代码中,我能够绑定一个不可观察的数据:

export class UserInfoComponent implements OnInit {

    data: object;

    constructor(private userInfoService: UserInfoService) {}

    ngOnInit() {

        this.userInfoService
            .getEmployeeInfo()
            .subscribe((response) => {
              this.data = response;
            });
    }
}

我不确定最佳做法是什么,或者每种方法的优缺点。

2 个答案:

答案 0 :(得分:1)

在这种情况下,您可以将变量设置为Observable-您有RxJS运算符的链接,并且在代码中您希望多次订阅链接流。因此,由于不必每次都合并这些运算符,因此可以将它们保留在属性中,然后仅向其中添加一个.susbcribe

this.heroes$ = this.searchTerms.pipe(
  // wait 300ms after each keystroke before considering the term
  debounceTime(300),

  // ignore new term if same as previous term
  distinctUntilChanged(),

  // switch to new search observable each time the term changes
  switchMap((term: string) => this.heroService.searchHeroes(term)),
);

inOneMethod() {
   this.heroes$.subscribe(data => this.first = data);
}

inAnotherMethod() {
   this.heroes.subscribe(data => this.second = data);
}

答案 1 :(得分:0)

可观察为类变量不是强制性的。 可观察基于使用流的概念,其中订阅者订阅此流发出的任何内容。

在这种情况下,默认情况下,此处的HTTP响应是可观察到的,您可以订阅该响应,并进一步使用此响应流发出的任何内容。