Question

我正在尝试复制angular-realworld-example-app，但我遇到了一个我不明白的错误。（我使用的是RxJS 5.4.0和Angular 4.2.5）。

我的路线“登录”有一个警卫“No Auth Guard”来检查用户是否已经登录。只有“未登录”的用户才能“登录”。警卫检查用户是否已登录，并否定答案（bool =＆gt;！bool）以确定用户是否可以通过。

User.service.ts：

import { Injectable } from '@angular/core';
import { Http } from '@angular/http';
import { Observable } from 'rxjs/Observable';
import { BehaviorSubject } from 'rxjs/BehaviorSubject';
import { ReplaySubject } from 'rxjs/ReplaySubject';
import 'rxjs/add/operator/distinctUntilChanged';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/catch';


import { ApiService } from './api.service';
import { JwtService } from './jwt.service';
import { User } from '../models/user.model';


@Injectable()
export class UserService {
    private currentUserSubject = new BehaviorSubject<User>(new User());
    public currentUser = this.currentUserSubject.asObservable().distinctUntilChanged();

    private isAuthenticatedSubject = new ReplaySubject<boolean>(1);
    public isAuthenticated = this.isAuthenticatedSubject.asObservable();

    constructor (
        private apiService: ApiService,
        private http: Http,
        private jwtService: JwtService
    ) {}

    // Verify JWT in localstorage with server & load user's info.
    // This runs once on application startup.
    populate() { // THIS IS CALLED IN APP.COMPONENT
        // If JWT detected, attempt to get & store user's info
        if (this.jwtService.getToken()) {
            this.apiService.get('/user')
                .subscribe(
                    data => this.setAuth(data.user),
                    err => this.purgeAuth()
                );
        } else {
            // Remove any potential remnants of previous auth states
            this.purgeAuth();
        }
    }

    setAuth(user: User) {
        // Save JWT sent from server in localstorage
        this.jwtService.saveToken(user.token);
        // Set current user data into observable
        this.currentUserSubject.next(user);
        // Set isAuthenticated to true
        this.isAuthenticatedSubject.next(true);
    }

    purgeAuth() {
        // Remove JWT from localstorage
        this.jwtService.destroyToken();
        // Set current user to an empty object
        this.currentUserSubject.next(new User());
        // Set auth status to false
        this.isAuthenticatedSubject.next(false);
    }

    attemptAuth(type, credentials): Observable<User> {
        const route = (type === 'login') ? '/login' : '';
        return this.apiService.post('/user' + route, {user: credentials})
            .map(
                data => {
                    this.setAuth(data.user);
                    return data;
                }
            );
    }

    getCurrentUser(): User {
        return this.currentUserSubject.value;
    }
}

没有-AUTH-guard.service.ts：

import { Injectable } from '@angular/core';
import { ActivatedRouteSnapshot, CanActivate, Router, RouterStateSnapshot } from '@angular/router';
import { Observable } from 'rxjs/Rx';
import 'rxjs/add/operator/map';

import { UserService } from '../services/user.service';

@Injectable()
export class NoAuthGuard implements CanActivate {
    constructor(
        private router: Router,
        private userService: UserService
    ) {}

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

        return this.userService.isAuthenticated.take(1).map(bool => !bool);
    }
}

尽管更新了我的导入，但我仍然收到错误，该错误不是函数

Error: Uncaught (in promise): TypeError: this.userService.isAuthenticated.take is not a function
TypeError: this.userService.isAuthenticated.take is not a function

类似但不重复：Getting boolean value from ReplaySubject<boolean> asObservable

Answer 1

我们可以通过两种方式解决它。

import 'rxjs/add/operator/take';

这更有可能将特定运营商导入您的服务。

import { Observable } from 'rxjs';

我更喜欢上面的语句，因为它提供了对Observable所需的所有运算符，而不是运算符的单独import语句。

ReplaySubject take不是一个函数

1 个答案: