如何在 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);
  }
}

Answer 1

这里有一段代码作为例子：

(function () {
  angular.module('app', [])
    .controller('MainController', function() {
      activate();
      function activate() {
        console.log('Success'); // this log will appear when ever your controller loads
      }
    });
})();

Answer 2

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

    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 ******

            }
        })
}

如何在 angular 中创建 "ngOnActive" 生命周期挂钩？

how to create "ngOnActive" life cycle hook in angular?

angular

typescript

hook

angular-lifecycle-hooks