如何在 Angular 2 中打开身份验证弹出窗口或模式

Question

I am trying to code a login component for my application in Angular 2 version rc-1. But I did not find how to open my modal without a button action.

When I load my app, I check if the user is logged or not (with the localStorage) : if he is not logged the login modal had to be openned.

So open/close modal is conditionned by a boolean parameter and not a action button.

Do you know how can I open a login modal without a button action ?

Thanks in advance,

Answer 1

Lets say you have a component that holds your modal.

export class YourModalComponent {
  constructor () {}

  public open(): void {
     //show modal
  }
}

And then you have a component that checks the local storage and has YourModalComponent as a children. If the user is logged in you just call modal.open() .

export class YourParentComponent {
  @ViewChild(YourModalComponent)
  public yourModal : YourModalComponent;

  constructor() {}

  public ngAfterViewInit(): void {
    //check if user is logged in
    if(!userIsLoggedIn) {
       this.yourModal.open();
    }

  }
}

You can also have the div displaying with ngIf so the YourModalComponent is only displayed if it meets the condition.