Question

我是新手，尝试学习它。我在app.component.ts中有一个函数，该函数将菜单注入app.component.html，并且菜单变量根据登录用户的权限是动态的，现在我想在用户登录后调用此方法。有效地做

这是我的app.component.ts

    cnt += (num & bit) > 0

Answer 1

在您的身份验证服务中，创建一个Observable，它在每次登录状态更改时发出：

import { Subject, Observable } from 'rxjs';     

private _statusChange$ = new Subject<boolean>();
private loginStatus$ = this._statusChange$.asObservable();

// Whenever the status changes:
this._statusChange$.next(newIsLoggedInValue);

然后，在您的组件内部，更改您的代码，使其侦听该Observable，如下所示：

this.authService.loginStatus$.subscribe((isLoggedIn) => {
    if(isLoggedIn()){
        const token = localStorage.getItem('token');
        const decodedToken = this.jwtHelper.decodeToken(token);
        this.userName = decodedToken.userName;
        this.hospitalName = decodedToken.hospitalName;
        this.permission = decodedToken.permission;
        if(this.permission == 'admin'){
            this.menuItems = this.adminMenuItems;
        } else {
            this.menuItems = this.nurseMenuItems;
        }
    }
})

这样，每次登录状态更改时都会触发

Answer 2

只需使用ngOnInit()方法调用它，该方法会在您的组件加载时触发

export class AppComponent implements OnInit {
  ngOnInit() {
    this.setMenu();
    }
  }

确保您导入-import { OnInit } from '@angular/core';

编码愉快！！

从角度6中的另一个组件调用app.component.ts中的方法

2 个答案: