angular - 来自解析器的 Angular 7 rxjs 订阅有什么问题

Question

我写了一个简短的代码来尝试组件中的路由解析器和订阅。这是路线配置：

  {
    path: '',
    component: EventsComponent,
    resolve: {
      events: EventsResolverService
    }
  },
  ...

Resolver 简单地实现了 Resolve 接口：

import { Injectable } from '@angular/core';
import { Resolve } from '@angular/router';
import { EventInterface } from './event-interface';
import { EventsService } from './events.service';
import { Observable } from 'rxjs';

@Injectable({
  providedIn: 'root'
})
export class EventsResolverService implements Resolve<Map<number, EventInterface>> {

  constructor(private eventsService: EventsService) { }

  public resolve(): Observable<Map<number, EventInterface>> {
    console.log('Resolver in progress');
    return this.eventsService.asObservable();
  }
}

然而，我用来将事件映射作为 Observable 的服务：

  public asObservable(): Observable<Map<number, EventInterface>> {
    if (this.events.size) {
      return of(this.events);
    } else {
      this._hydrate();
      console.log('Events are : ' + this.events.size);
      return of(this.events);
    }
  }

最后，在组件的 ngOnInit() 方法中：

  public ngOnInit(): void {
    this.activatedRoute.data.subscribe(
      (events: Map<number, EventInterface>) => {
        console.log('Hi events resolved ' + events.size);
        this.eventsMap = events;
      },
      (error: any) => {
          console.log('Something went wrong : ' + error);
      }
    );
  }

控制台消息始终返回：未定义，但在服务中，事件映射大小正确返回：

那么那段代码有什么问题呢？

Answer 1

ActivatedRoute.data您正在以错误的方式处理由发出的值。

this.activatedRoute.data.pipe(map(data=>data.events)).subscribe(
      (events: Map<number, EventInterface>) => {
        console.log('Hi events resolved ' + events.size);
        this.eventsMap = events;
      },
      (error: any) => {
          console.log('Something went wrong : ' + error);
      }
    );