angular - 如何以角度创建“ngOnActive”生命周期挂钩？

Question

我希望当我的组件在主页上处于活动状态时调用生命周期挂钩。

它的登录页面。

当我的组件在主页上时，即处于活动状态时，我想查看我是否已经拥有以前登录的登录令牌，并且根据结果我想导航到不同的页面。

如果没有，是否有任何“ngOnActive”钩子，那么如何创建它？

还是有其他方法可以实现这一目标？

我的代码：

import { Component, OnInit } from '@angular/core';
import { NgForm } from '@angular/forms';
import {LoginService} from './login.service';
import {TokenService} from '../data/token.service';
import {Router} from '@angular/router';

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

  constructor(private loginService: LoginService, private tokenService: TokenService, private router: Router) { }

  ngOnInit() {
    if (this.tokenService.getToken() !== '') {
      console.log(this.tokenService.tk);
      this.router.navigate(['/admin']);
    }
  }
  onSubmit(form: NgForm) {
    this.loginService.login(form.value.email, form.value.password);
  }
}

标签： angulartypescripthookangular-lifecycle-hooks

Answer 1

您可以使用一个技巧来做到这一点，那就是检测路线变化。

    import { ActivatedRoute } from '@angular/router';
    
    constructor(
        private routerActive:ActivatedRoute
      ) {}
    
    ngOnInit() {
        this.routerActive.paramMap.subscribe(paramMap => {
            if (this.router.url === "/yourURL") {

              // ***** This runs whenever your page is displayed ******

            }
        })
}