如果添加另一个数据流，解析器不会解析 [英] Resolver does not resolve if another data stream is added

问题描述

我正在尝试使用解析器来根据路由包含的给定参数检索数据.

不幸的是，当我添加另一个数据流时，我的数据依赖于解析器从未真正解析过.

如果我直接返回一个立即解析的值，一切正常.我调试了情况，看到我收到了所有部分信息，但最终未能真正解决.

这是一个快速示例.如果需要更多代码来理解问题，请联系我.

我的服务:

导出类 MyService {得到(酒吧){返回(新 Foo(bar))；}}

SecondService(这个从后端检索数据):

导出类 SecondService {private readonly _observable: Observable;构造函数(){this._observable = 合并(//其他操作).管道(//其他操作分享重播(1))}observable(): Observable{返回 this._observable;}}

解析器:

导出类 MyResolver {构造函数(_secondService:SecondService，_myService:MyService){}解析(路由:ActivatedRouteSnapshot，状态:RouterStateSnapshot):Observable{//不起作用 - 根本无法解决//返回 this._secondService//.observable()//  .管道(//switchMap((bar) => this._myService.get(bar)),//);//作品返回(新 Foobar('sampleData'));}}

路由器:

const 路由:Routes = [{路径:'someroute'，组件:SomeComponent，canActivate: [SomeGuard],解决: {我的数据:我的解析器，},},];

组件:

export class SomeComponent 实现 OnInit {构造函数(私有只读_route:ActivatedRoute){}ngOnInit() {this._route.data.subscribe((数据) => {console.log('收到:', 数据);this.myData = 数据；});}}

SomeComponent.html

收到:{{ myData |json }}

解决方案

我的问题的答案很简单，与订阅已解决的 observable 无关，因为框架已经自动做到了.

为了让解析器完成，它所依赖的所有流都需要完成.如果您碰巧使用了热 observable，则需要使用另一个运算符，例如 take，以便流在该位置完成.

所以，所有代码都保持不变，只是我将解析器更改为:

resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable{返回 this._secondService.observable().管道(采取(1)，switchMap((bar) => this._myService.get(bar)),);}

@eduPeeth:感谢您的回答/建议，不幸的是，这是一个小得多的问题.

I am trying to use a resolver in order to retrieve data depending on the given parameters the route holds.

Unfortunately, the moment I add another data stream that my data depends on the resolver never actually resolves.

If I directly return an immediately resolving value everything works fine. I debugged the situation to see that I receive all partial information but it just fails to actually resolve in the end.

Here's a quick sample. Hit me up if there's more code needed to understand the problem.

MyService:

export class MyService {
  get(bar) {
    return of(new Foo(bar));
  }
}

SecondService (This one retrieves data from the backend):

export class SecondService {
  private readonly _observable: Observable<Bar>;
  constructor() {
    this._observable = merge(
      // Other manipulations
    ).pipe(
      // other manipulations
      shareReplay(1)
    )
  }

  observable(): Observable<Bar> {
    return this._observable;
  }
}

Resolver:

export class MyResolver {
  constructor(_secondService: SecondService, _myService: MyService) {}

  resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<Foo> {
    // Does not work - Simply does not resolve
    // return this._secondService
    //   .observable()
    //   .pipe(
    //     switchMap((bar) => this._myService.get(bar)),
    //   );

    // WORKS
    return of(new Foobar('sampleData'));
  }
}

Router:

const routes: Routes = [
  {
    path: 'someroute',
    component: SomeComponent,
    canActivate: [SomeGuard],
    resolve: {
      myData: MyResolver,
    },
  },
];

Component:

export class SomeComponent implements OnInit {
  constructor(private readonly _route: ActivatedRoute) {}

  ngOnInit() {
    this._route.data
      .subscribe((data) => {
      console.log('received:', data);
      this.myData = data;      
    });
  }
}

SomeComponent.html

<pre *ngIf="myData">
  Received: {{ myData | json }}
</pre>

解决方案

The answer to my problem is rather simple and had nothing to do with subscribing to the resolved observables, as the framework already did that automagically.

In order for a resolver to finish, all the streams it depends on need to complete. If you happen to use a hot observable it is required to use another operator like take so that the stream completes at that location.

So, all the code remains the same, except that I changed the resolver to:

resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<Foo> {
  return this._secondService
    .observable()
    .pipe(
      take(1),
      switchMap((bar) => this._myService.get(bar)),
  );
}

@eduPeeth: Thank you for your answer/suggestions, unfortunately, it was a far more minor issue.

这篇关于如果添加另一个数据流，解析器不会解析的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！