diff --git a/projects/ng-bootstrap-form-validation/src/lib/Components/form-group/form-group.component.ts b/projects/ng-bootstrap-form-validation/src/lib/Components/form-group/form-group.component.ts index a0811b5..0632d02 100644 --- a/projects/ng-bootstrap-form-validation/src/lib/Components/form-group/form-group.component.ts +++ b/projects/ng-bootstrap-form-validation/src/lib/Components/form-group/form-group.component.ts @@ -7,12 +7,14 @@ import { Input, QueryList, OnInit, - AfterContentInit + AfterContentInit, + Inject } from "@angular/core"; import { FormControlName } from "@angular/forms"; import { ErrorMessageService } from "../../Services/error-message.service"; import { MessagesComponent } from "../messages/messages.component"; import { ErrorMessage } from "../../Models/error-message"; +import { DISABLE_SUCCESS_STATE } from "../../Tokens/tokens"; @Component({ // tslint:disable:component-selector @@ -45,7 +47,8 @@ export class FormGroupComponent implements OnInit, AfterContentInit { return ( !this.FormControlNames.some(c => !c.valid) && this.FormControlNames.some(c => c.dirty && c.touched) && - !this.validationDisabled + !this.validationDisabled && + !this.disableSuccessState ); } @@ -58,7 +61,8 @@ export class FormGroupComponent implements OnInit, AfterContentInit { constructor( private elRef: ElementRef, - private errorMessageService: ErrorMessageService + private errorMessageService: ErrorMessageService, + @Inject(DISABLE_SUCCESS_STATE) private disableSuccessState: boolean ) {} ngAfterContentInit() { diff --git a/projects/ng-bootstrap-form-validation/src/lib/Components/messages/messages.component.ts b/projects/ng-bootstrap-form-validation/src/lib/Components/messages/messages.component.ts index 79f7f59..10f01d7 100644 --- a/projects/ng-bootstrap-form-validation/src/lib/Components/messages/messages.component.ts +++ b/projects/ng-bootstrap-form-validation/src/lib/Components/messages/messages.component.ts @@ -5,7 +5,9 @@ import { BOOTSTRAP_VERSION } from "../../Tokens/tokens"; @Component({ selector: "bfv-messages", template: ` - {{message}} + {{ + message + }} `, styles: [ ` diff --git a/projects/ng-bootstrap-form-validation/src/lib/Directives/form-control.directive.ts b/projects/ng-bootstrap-form-validation/src/lib/Directives/form-control.directive.ts index db9ddba..e77c4ca 100644 --- a/projects/ng-bootstrap-form-validation/src/lib/Directives/form-control.directive.ts +++ b/projects/ng-bootstrap-form-validation/src/lib/Directives/form-control.directive.ts @@ -9,7 +9,7 @@ import { } from "@angular/core"; import { ControlContainer, FormControl } from "@angular/forms"; import { BootstrapVersion } from "../Enums/BootstrapVersion"; -import { BOOTSTRAP_VERSION } from "../Tokens/tokens"; +import { DISABLE_SUCCESS_STATE, BOOTSTRAP_VERSION } from "../Tokens/tokens"; export function controlPath(name: string, parent: ControlContainer): string[] { // tslint:disable-next-line:no-non-null-assertion @@ -34,7 +34,8 @@ export class FormControlDirective { return ( this.bootstrapFour && this.control.valid && - (this.control.touched || this.control.dirty) + (this.control.touched || this.control.dirty) && + !this.disableSuccessState ); } @@ -74,6 +75,7 @@ export class FormControlDirective { @Host() @SkipSelf() private parent: ControlContainer, + @Inject(DISABLE_SUCCESS_STATE) private disableSuccessState: boolean, @Inject(BOOTSTRAP_VERSION) private bootstrapVersion: BootstrapVersion ) {} } diff --git a/projects/ng-bootstrap-form-validation/src/lib/Models/NgBootstrapFormValidationModuleOptions.ts b/projects/ng-bootstrap-form-validation/src/lib/Models/NgBootstrapFormValidationModuleOptions.ts index 2502aa3..8e7ee24 100644 --- a/projects/ng-bootstrap-form-validation/src/lib/Models/NgBootstrapFormValidationModuleOptions.ts +++ b/projects/ng-bootstrap-form-validation/src/lib/Models/NgBootstrapFormValidationModuleOptions.ts @@ -2,6 +2,7 @@ import { BootstrapVersion } from "../Enums/BootstrapVersion"; import { ErrorMessage } from "./error-message"; export interface NgBootstrapFormValidationModuleOptions { + disableSuccessState?: boolean; customErrorMessages?: ErrorMessage[]; bootstrapVersion: BootstrapVersion; } diff --git a/projects/ng-bootstrap-form-validation/src/lib/Tokens/tokens.ts b/projects/ng-bootstrap-form-validation/src/lib/Tokens/tokens.ts index c84dd53..ad3c678 100644 --- a/projects/ng-bootstrap-form-validation/src/lib/Tokens/tokens.ts +++ b/projects/ng-bootstrap-form-validation/src/lib/Tokens/tokens.ts @@ -2,6 +2,10 @@ import { InjectionToken } from "@angular/core"; import { BootstrapVersion } from "../Enums/BootstrapVersion"; import { ErrorMessage } from "../Models/error-message"; +export const DISABLE_SUCCESS_STATE = new InjectionToken( + "ng-bootstrap-form-validation disable success state" +); + export const CUSTOM_ERROR_MESSAGES = new InjectionToken( "ng-bootstrap-form-validation custom error messages" ); diff --git a/projects/ng-bootstrap-form-validation/src/lib/ng-bootstrap-form-validation.module.ts b/projects/ng-bootstrap-form-validation/src/lib/ng-bootstrap-form-validation.module.ts index 5dc4007..264a179 100644 --- a/projects/ng-bootstrap-form-validation/src/lib/ng-bootstrap-form-validation.module.ts +++ b/projects/ng-bootstrap-form-validation/src/lib/ng-bootstrap-form-validation.module.ts @@ -3,7 +3,11 @@ import { NgModule, ModuleWithProviders } from "@angular/core"; import { FormValidationDirective } from "./Directives/form-validation.directive"; import { MessagesComponent } from "./Components/messages/messages.component"; import { ErrorMessageService } from "./Services/error-message.service"; -import { CUSTOM_ERROR_MESSAGES, BOOTSTRAP_VERSION } from "./Tokens/tokens"; +import { + DISABLE_SUCCESS_STATE, + CUSTOM_ERROR_MESSAGES, + BOOTSTRAP_VERSION +} from "./Tokens/tokens"; import { BootstrapVersion } from "./Enums/BootstrapVersion"; import { FormGroupComponent } from "./Components/form-group/form-group.component"; import { NgBootstrapFormValidationModuleOptions } from "./Models/NgBootstrapFormValidationModuleOptions"; @@ -33,6 +37,10 @@ export class NgBootstrapFormValidationModule { return { ngModule: NgBootstrapFormValidationModule, providers: [ + { + provide: DISABLE_SUCCESS_STATE, + useValue: userOptions.disableSuccessState || false + }, { provide: CUSTOM_ERROR_MESSAGES, useValue: userOptions.customErrorMessages || [],