Question

我有一个功能，可以记住以前的网址

   prevId () {
     let name, id, lat, lng;
    this.router.events
      .filter(event => event instanceof NavigationEnd)
      .subscribe(e => {
        console.log('prev:', this.previousUrl);
        this.previousUrl = (e as NavigationEnd).url;
    }

如果可能的话，我想用Observable风格重写它，但我尝试的一切都不起作用。有可能解决吗？你能不能给我一些关于Observable的好文章，因为我只是初学者，主题似乎很难。

UPD：我需要稍后在函数外部使用数据，这就是我需要Observer的原因。

例如

myFun(a) {
console.log(a);
}

myFun(this.previousUrl);

Answer 1

如果你唯一需要的是使用你的函数之外的url，你可以这样做：

import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/filter';
import 'rxjs/add/operator/take';

prevId(): Observable<NavigationEnd> {
  return new Observable(observer => {
    this.router.events
      .filter(event => event instanceof NavigationEnd)
      .take(1)
      .subscribe(e => {
        observer.next(e as NavigationEnd);
        observer.complete();
      });
  });
}

然后你必须像这样调用函数：

prevId().subscribe(navigationEndEvent => {
  this.previousUrl = navigationEndEvent.url;
});

我让这个例子认为您在调用prevId()时只需要previousUrl信息，因此我将.take(1)运算符设为observer.complete()。当第一个值来自.take(1)时，this.router.event会自动取消订阅observer.complete()订阅。并且{{1}}还将取消订阅返回的Observable中所做的所有订阅。

订阅Angular2中的Observable

1 个答案: