Question

我面临角度问题。

我有一个authService，我通过我的所有组件使用，我正在使用我可以在我的组件中订阅的主题，如果我需要检查用户是否已登录，我面临的问题是这是有效的如果我直接加载将要使用它的页面，那很好，但是当我通过一条路线时却没有。

import { Component, OnInit } from '@angular/core';
import {AuthenticationService} from "../../services/authentication.service";

@Component({
  selector: 'app-testing',
  templateUrl: './testing.component.html',
  styleUrls: ['./testing.component.css']
})
export class TestingComponent implements OnInit {

  loggedIn: boolean = false;

  constructor(private authService: AuthenticationService) { }

  ngOnInit() {
    this.authService.getLoginStatus().subscribe(loginStatus => this.loggedIn = loginStatus);
  }

}

所有这些代码都订阅了authService主题，可以在下面看到

import {Injectable} from '@angular/core';
import {HttpClient} from "@angular/common/http";
import {environment} from "../../environments/environment";
import 'rxjs/add/operator/map'
import {UserService} from "./user.service";
import {Subject} from "rxjs/Subject";
import {Subscription} from "rxjs/Subscription";

@Injectable()
export class AuthenticationService {

  private isLoggedIn = new Subject<boolean>();
  private apiUrl = environment.apiUrl + 'login/';

  private deleteSubscribe: Subscription;

  constructor(private http: HttpClient,
              private userService: UserService) {
    this.isLoggedIn.next(false);
  }

  login(username: string, password: string) {
    return this.http.post<any>(this.apiUrl + '?' + environment.apiDebug, {
      username: username,
      password: password
    }).map(user => {
      // Login success if there is a JWT token in the
      if (user.loginSucess && user.token) {
        // Store the user details and JWT token in the local storage to keep the user logged in between page refreshes
        localStorage.setItem('currentUser', user.token);
        // Grab the user data then set logged in equal to true
        this.userService.getAccountDetails().subscribe(userData => {
          this.isLoggedIn.next(true);
        });
      }
      return user;
    });
  }

  checkLoginStatus() {
    if (localStorage.getItem('currentUser')) {
      return this.http.get<any>(this.apiUrl + 'check_login')
          .map(loginStatusReturn => {
            if (loginStatusReturn.isLoggedIn === true) {
              this.isLoggedIn.next(true);
              this.userService.getAccountDetails().subscribe();
              return true;
            } else {
              // Delete the local stored cookie, It was invalid
              localStorage.removeItem('currentUser');
              this.isLoggedIn.next(false);
              this.userService.clearUserInfo();
              return false;
            }
          })
    }
  }

  logout() {
    // Remove user from the local storage
    this.deleteSubscribe = this.http.delete(this.apiUrl + 'logout?').subscribe();
    localStorage.removeItem('currentUser');
    this.userService.clearUserInfo();
    this.isLoggedIn.next(false);
    this.deleteSubscribe.unsubscribe();
  }

  getLoginStatus() {
    return this.isLoggedIn.asObservable();
  }
}

当我直接加载页面时，我看到测试组件中的loginStatus设置为true并且一切正常，如果我然后单击到另一个页面，然后单击路由器链接返回测试页面订阅中的代码block永远不会运行，登录状态保持为false

我在app.module.ts下的提供商

下导入了服务

我正处于用这一个敲打桌面的阶段

非常感谢任何帮助

干杯

Answer 1

您的主题（dqueue = DelayQueue(burst_limit=29, time_limit_ms=1014) dqueue(client.send_message,inputPeerUser,msg)）可能需要isLoggedIn。 ReplaySubject将向所有新订阅者重新发出最后一个值。就目前而言，当您的第二个组件订阅时，它将不会收到活动。

看起来这个服务是在你的app模块中提供的，这意味着它只会被初始化一次（当应用程序首次加载时）。因此，构造函数中的ReplaySubject只会触发一次 - 可能在您的新组件初始化之前。

Angular订阅代码适用于直接页面加载，但不适用于路由

1 个答案: