Angular应用将根据本地存储值进行引导

时间:2018-12-10 13:08:58

标签: angular6

当前我正在使用angular 6,我想在angular bootstrap模块之前检查本地存储值,如果本地存储中存在该值,我将调用bootstrap模块,否则我想阻止bootstrap和导航到外部登录页面网址。如何使用角度APP_INITIALIZER做到这一点?

import { APP_INITIALIZER, NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule } from '@angular/forms';

import { AppComponent } from './app.component';
import { HelloComponent } from './hello.component';

export function authGaurd(): () => Promise<any> {
  return (): Promise<any> => {
    return new Promise((resolve, reject) => {
      if(localStorage.getItem('app-token')) {
        resolve();
      } else {
        window.location.href = 'www.my-external-sso-login-page.com';// this sso page will set the local storge 'app-token', also i dont know how to re-direct to this page.
      }
    });
  };
}

@NgModule({
  imports:      [ BrowserModule, FormsModule ],
  declarations: [ AppComponent, HelloComponent ],
  providers: [{
    provide: APP_INITIALIZER,
    useFactory: authGaurd,
    multi: true
  }],
  bootstrap:    [ AppComponent ]
})
export class AppModule { }

1 个答案:

答案 0 :(得分:0)

您不能停止引导Angular应用程序。但是还有另一种方法。 应用程序加载后即可进行导航。