Angular 5/6 Resolver 和 Observable

Angular 5/6 Resolver and Observable

在 Angular 6.

中尝试使用 Resolver 真的快要疯了

我的解析器,工作版本:

    @Injectable()
export class MyResolver implements Resolve<boolean> {
    constructor() {
    }

    resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | boolean {
        return true;
    }

我在我的路由中是这样注入的:

path: "secure",
    component: SecureComponent,
    canActivate: [AuthGuard],
    canActivateChild: [AuthGuard],
    resolve: {
        myValue: MyResolver
    }

这正常工作,组件构造函数被触发,我可以从路由中检索 myValue。

但是一旦我将解析器更改为:

return Observable.create(true);

或者任何 returns 一个 Observable 而不是一个普通值的代码,组件的构造函数不再被触发,我在我的路线上得到一个空白页面。解析器代码仍然完整运行。

我通过在构造函数的第一行放置 console.log("foo") 来验证构造函数没有被触发,但它没有被调用。

所以我不明白为什么我不能从我的解析器输出可观察值。解析器的全部意义在于解析延迟值(从而返回可观察值)。

我做错了什么?

我认为问题是 Observable.create 没有完成可观察流。因此订阅你的路线不会发出任何东西。你应该尝试这样的事情:

import { of } from 'rxjs/observable/of';

return of(true);

这将 return 一个完整的可观察对象。或者你也可以这样做:

return Observable.create((observer) => {
  observer.next(true);
  observer.complete();
    });

告诉我..

Observable.create accepts a function 作为参数。

Observable.create(true) 将导致订阅错误。组件未实例化,因为存在未捕获的导航错误。

如果解析器应该 return 现有值,这应该按照原始代码所示进行:

resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | boolean {
    return true;
}