File
Metadata
selector |
app-login-modal |
template |
<div class="modal-header" *ngIf="options && options.hasHeader">
<div class="modal-title pull-left">{{ options.title | translate }}</div>
<button type="button" class="close" aria-label="Close" (click)="bsModalRef.hide()">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body" *ngIf="options">
<ab-login-form *ngIf="!options.data.authenticated"
[translateService]="options.translateService"
[nameRegex]="options.data.nameRegex"
[passwordRegex]="options.data.passwordRegex"
[nameLabel]="options.data.nameLabel"
[passwordLabel]="'PASSWORD'"
[submitLabel]="'LOGIN'"
[nameError]="'FIELD REQUIRED'"
[passwordError]="'PASSWORD REQUIRED'"
[submitError]="options.data.submitError"
(login)="options.data.loginHandler.call(options.context,$event)">
<h2 class="text-center">{{ 'LOGIN' | translate }}</h2>
</ab-login-form>
<form *ngIf="options.data.authenticated">
<button type="submit" (click)="options.data.logoutHandler($event)" class="btn btn-default">{{ 'LOGOUT' | translate }}</button>
</form>
</div>
<div class="modal-footer" *ngIf="options && options.hasFooter">
<button type="button" class="btn btn-default" (click)="bsModalRef.hide()">{{ 'CLOSE' | translate }}</button>
</div>
|
Constructor
constructor(bsModalRef: BsModalRef)
|
|
Parameters :
Name |
Type |
Optional |
bsModalRef |
BsModalRef
|
no
|
|
Public
bsModalRef
|
bsModalRef: BsModalRef
|
Type : BsModalRef
|
|
Public
options
|
options: any
|
Type : any
|
|
Public
translateService
|
translateService: TranslateService
|
Type : TranslateService
|
|
import { Component, Input, OnChanges } from '@angular/core';
import { TranslateService } from '@ngx-translate/core';
// import { BsModalService } from 'ngx-bootstrap/modal';
//import { BsModalRef } from 'ngx-bootstrap/modal/modal-options.class';
import { BsModalRef } from 'ngx-bootstrap/modal';
@Component({
selector: 'app-login-modal',
template: `
<div class="modal-header" *ngIf="options && options.hasHeader">
<div class="modal-title pull-left">{{ options.title | translate }}</div>
<button type="button" class="close" aria-label="Close" (click)="bsModalRef.hide()">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body" *ngIf="options">
<ab-login-form *ngIf="!options.data.authenticated"
[translateService]="options.translateService"
[nameRegex]="options.data.nameRegex"
[passwordRegex]="options.data.passwordRegex"
[nameLabel]="options.data.nameLabel"
[passwordLabel]="'PASSWORD'"
[submitLabel]="'LOGIN'"
[nameError]="'FIELD REQUIRED'"
[passwordError]="'PASSWORD REQUIRED'"
[submitError]="options.data.submitError"
(login)="options.data.loginHandler.call(options.context,$event)">
<h2 class="text-center">{{ 'LOGIN' | translate }}</h2>
</ab-login-form>
<form *ngIf="options.data.authenticated">
<button type="submit" (click)="options.data.logoutHandler($event)" class="btn btn-default">{{ 'LOGOUT' | translate }}</button>
</form>
</div>
<div class="modal-footer" *ngIf="options && options.hasFooter">
<button type="button" class="btn btn-default" (click)="bsModalRef.hide()">{{ 'CLOSE' | translate }}</button>
</div>
`
})
export class LoginModalComponent {
public options: any;
public translateService: TranslateService;
constructor(public bsModalRef: BsModalRef) {
}
}
Legend
Html element with directive