Try to use materialize for login popup.

src/login/login.module.ts

@@ -5,6 +5,7 @@ import { CommonModule } from '@angular/common';
 import { ReactiveFormsModule } from '@angular/forms';
 import { HttpClientModule } from '@angular/common/http';
 import { HTTP_INTERCEPTORS } from '@angular/common/http';
+import { MaterializeModule } from 'ng2-materialize';
 
 import { NgLoggerModule } from '@nsalaun/ng-logger';
 
@@ -18,6 +19,7 @@ import { LoginModalComponent } from './loginModal.component';
     HttpClientModule,
     CommonModule,
     ReactiveFormsModule,
+    MaterializeModule,
     NgLoggerModule,
   ],
   providers: [

src/login/login.service.ts

@@ -6,7 +6,7 @@ import { Observable} from 'rxjs/Rx';
 import * as base64 from 'base64util';
 
 import { Logger } from '@nsalaun/ng-logger';
-import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
+import { MzModalService } from 'ng2-materialize';
 
 import { Token } from './token';
 import { LoginModalComponent } from './loginModal.component';
@@ -18,24 +18,25 @@ export class LoginService {
     constructor(
         private httpClient: HttpClient,
         private logger: Logger,
-        private ngbModal: NgbModal,
+        private mzModalService: MzModalService,
     ) {}
 
     public readonly url: string = '/api/user/login';
 
     login(): Observable<Token> {
-        let modal = this.ngbModal.open(LoginModalComponent);
+        let modal = this.mzModalService.open(LoginModalComponent);
 
         sessionStorage.clear();
 
-        let observable: Observable<any> = Observable.fromPromise(modal.result);
+        //let observable: Observable<any> = Observable.fromPromise(modal.result);
 
-        return observable.flatMap((login: Login) =>
-            this.doLogin(login)
-        ).map((token: Token): Token => {
-            this.accessToken = token.access_token;
-            return token;
-        });
+        //return observable.flatMap((login: Login) =>
+        //    this.doLogin(login)
+        //).map((token: Token): Token => {
+        //    this.accessToken = token.access_token;
+        //    return token;
+        //});
+        return null;
     }
 
     logout() {

src/login/loginModal.component.ts

@@ -1,7 +1,7 @@
 // vim: set tw=80 ts=2 sw=2 sts=2:
 import { Component, Input, ViewChild } from '@angular/core';
 
-import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
+import { MzBaseModal } from 'ng2-materialize';
 
 import { Login } from './login';
 import { LoginFormComponent } from './loginForm.component';
@@ -9,15 +9,16 @@ import { LoginFormComponent } from './loginForm.component';
 @Component({
   selector: 'login-modal',
   template: `
-<div class="modal-header">
-  <h3 class="modal-title" id="modal-title">Authentification requise</h3>
-</div>
+<mz-modal>
+  <mz-modal-header>
+    Authentification requise
+  </mz-modal-header>
 
-<div class="modal-body" id="modal-body">
+  <mz-modal-content>
     <login-form (submit)="submit()" #loginForm="loginForm"></login-form>
-</div>
+  </mz-modal-content>
 
-<div class="modal-footer">
+  <mz-modal-footer>
     <button class="btn btn-primary" [disabled]="!loginForm.form.valid" (click)="submit()">
       Login
     </button>
@@ -25,27 +26,24 @@ import { LoginFormComponent } from './loginForm.component';
     <button class="btn btn-default" (click)="cancel()">
       Cancel
     </button>
-</div>
+  </mz-modal-footer>
+</mz-modal>
   `
 })
-export class LoginModalComponent {
+export class LoginModalComponent extends MzBaseModal {
   @ViewChild('loginForm') loginForm: LoginFormComponent;
 
-  constructor(private activeModal: NgbActiveModal) {
+  //submit(): void {
+  //  let formModel = this.loginForm.form.value;
+  //  let login: Login = new Login();
 
-  }
-
-  submit(): void {
-    let formModel = this.loginForm.form.value;
-    let login: Login = new Login();
-
-    login.email = formModel.email;
-    login.password = formModel.password;
-
-    this.activeModal.close(login);
-  }
-
-  cancel(): void {
-    this.activeModal.dismiss("closed");
-  }
+  //  login.email = formModel.email;
+  //  login.password = formModel.password;
+
+  //  this.activeModal.close(login);
+  //}
+
+  //cancel(): void {
+  //  this.activeModal.dismiss("closed");
+  //}
 }