Question

我正在构建用户配置文件数据存储，因此我的Angular 2应用程序不需要经常访问服务器。当我直接使用服务时，应用程序当前正常运行，但是当我在其间添加数据存储层时，它的行为就好像我的observable只发出一次（当我的导航栏组件读取其currentuser.name时）。使用该服务的组件似乎工作，我的AuthGuard不再工作（使用UserProfileStore获取用户信息）。我怀疑我使用的主题不正确和/或需要使用 BehaviourSubject 或 ReplaySubject 的某些变体，但我真的不知道从哪里开始。我的代码是基于此示例的半基础：Cory Ryan Angular 2 Observable Data Services

关于我缺少的任何想法？

用户-profile.store.ts

@Injectable()
export class UserProfileStore implements OnDestroy {
private _currentUser:SjfrUser;
private _currentUser$: Subject<MyAppUser>;
private _subscription: Subscription;

constructor(private authService: AuthService) {
    this._currentUser$ = <Subject<MyAppUser>> new Subject();
}

getCurrentUser = () : Observable<MyAppUser> => {

    if (!this._currentUser) {
        let currentUser$ = this.authService.getCurrentUser(); // Performs http
        this._subscription = currentUser$.subscribe((currentUser: MyAppUser) => {                
            this._currentUser = currentUser;
            this._currentUser$.next(this._currentUser);
        });
    }

    return this._currentUser$.asObservable();
}

ngOnDestroy() {
    this._subscription.unsubscribe();
}

}

的Auth-Guard.service.ts

@Injectable()
export class AuthGuard implements CanActivate, CanActivateChild, CanLoad {
    constructor(private userProfileStore: UserProfileStore, private authService: AuthService, private router: Router) { }

    canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean> {        

        let url: string = state.url;

        //var currentUser$ = this.authService.getCurrentUser(); // Works with this
        var currentUser$ = this.userProfileStore.getCurrentUser(); // No longer works            

        return currentUser$.map(x => {
            console.log("AuthGuard" + x.userName);  // This code no longer gets executed when using the datastore
            if (x.isExternalUser && url === '/external') {
                return true;
            } else if (x.isInternalUser && url === '/internal') {
                return true;
            } else {
                this.router.navigate(['/pagenotfound']);
                return false;
            }
        });     


    }
...

Answer 1

尝试在地图

之后使用.first（）

＆＃13;

@Injectable()
export class AuthGuard implements CanActivate, CanActivateChild, CanLoad {
    constructor(private userProfileStore: UserProfileStore, private authService: AuthService, private router: Router) { }

    canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean> {        

        let url: string = state.url;

        //var currentUser$ = this.authService.getCurrentUser(); // Works with this
        var currentUser$ = this.userProfileStore.getCurrentUser(); // No longer works            

        return currentUser$.map(x => {
            console.log("AuthGuard" + x.userName);  // This code no longer gets executed when using the datastore
            if (x.isExternalUser && url === '/external') {
                return true;
            } else if (x.isInternalUser && url === '/internal') {
                return true;
            } else {
                this.router.navigate(['/pagenotfound']);
                return false;
            }
        }).first();     


    }

＆＃13;

Angular2 DataStore - 使用rxjs时，authGuards不再起作用

1 个答案: