Skip to content
Permalink
Browse files

Global validation using FormlyConfig. Fix typo in custom-wrrapper folder

  • Loading branch information...
witek1902 committed May 9, 2019
1 parent 471ecf3 commit 8b23fc4478b8fac4bd027ca4a8c5329706e9b141
Showing with 73 additions and 53 deletions.
  1. +5 −18 app-formly-playground/src/app/app.module.ts
  2. +3 −0 app-formly-playground/src/app/components/home/home.component.ts
  3. 0 ...ound/src/app/shared/{custom-wrrappers → custom-wrappers}/card-wrapper/card-wrapper.component.html
  4. 0 ...ound/src/app/shared/{custom-wrrappers → custom-wrappers}/card-wrapper/card-wrapper.component.scss
  5. 0 ...ground/src/app/shared/{custom-wrrappers → custom-wrappers}/card-wrapper/card-wrapper.component.ts
  6. 0 .../src/app/shared/{custom-wrrappers → custom-wrappers}/img-radio-type/img-radio-type.component.html
  7. 0 .../src/app/shared/{custom-wrrappers → custom-wrappers}/img-radio-type/img-radio-type.component.scss
  8. 0 ...nd/src/app/shared/{custom-wrrappers → custom-wrappers}/img-radio-type/img-radio-type.component.ts
  9. +3 −0 app-formly-playground/src/app/shared/custom-wrappers/index.ts
  10. 0 .../src/app/shared/{custom-wrrappers → custom-wrappers}/repeat-section/repeat-section.component.html
  11. 0 .../src/app/shared/{custom-wrrappers → custom-wrappers}/repeat-section/repeat-section.component.scss
  12. 0 ...nd/src/app/shared/{custom-wrrappers → custom-wrappers}/repeat-section/repeat-section.component.ts
  13. +0 −3 app-formly-playground/src/app/shared/custom-wrrappers/index.ts
  14. +1 −0 app-formly-playground/src/app/shared/services/index.ts
  15. +39 −0 app-formly-playground/src/app/shared/services/validations.loader.ts
  16. +0 −20 app-formly-playground/src/app/shared/validations.ts
  17. +11 −6 app-formly-playground/src/assets/translations/en.json
  18. +11 −6 app-formly-playground/src/assets/translations/pl.json
@@ -13,7 +13,7 @@ import { FormlyMatDatepickerModule } from '@ngx-formly/material/datepicker';
import { AppRoutingModule } from '@app/app-routing.module';

import { AppComponent } from '@app/app.component';
import { CardWrapperComponent, RepeatSectionComponent, ImgRadioTypeComponent } from '@app/shared/custom-wrrappers';
import { CardWrapperComponent, RepeatSectionComponent, ImgRadioTypeComponent } from '@app/shared/custom-wrappers';
import { HomeComponent } from '@app/components';
import {
ExerciseOneComponent,
@@ -31,14 +31,7 @@ import {
ExerciseFiveFtComponent
} from '@app/components/exercises-reactive-forms';

import { RequestService, DictService, LanguageService } from '@app/shared/services';

import {
minlengthValidationMessage,
maxlengthValidationMessage,
minValidationMessage,
maxValidationMessage
} from '@app/shared/validations';
import { RequestService, DictService, LanguageService, ValidationLoader } from '@app/shared/services';

import { TranslateModule, TranslateService } from '@ngx-translate/core';
import { HttpClientModule } from '@angular/common/http';
@@ -73,14 +66,7 @@ import { HttpClientModule } from '@angular/common/http';
types: [
{ name: 'repeat-section', component: RepeatSectionComponent },
{ name: 'app-radio', component: ImgRadioTypeComponent },
],
validationMessages: [
{ name: 'required', message: 'This field is required' },
{ name: 'minlength', message: minlengthValidationMessage },
{ name: 'maxlength', message: maxlengthValidationMessage },
{ name: 'min', message: minValidationMessage },
{ name: 'max', message: maxValidationMessage },
],
]
}),
FormlyMaterialModule,
FormlyMatDatepickerModule,
@@ -94,7 +80,8 @@ import { HttpClientModule } from '@angular/common/http';
RequestService,
DictService,
LanguageService,
TranslateService
TranslateService,
ValidationLoader
],
bootstrap: [AppComponent]
})
@@ -4,6 +4,7 @@ import { TranslateService } from '@ngx-translate/core';
import { FormGroup } from '@angular/forms';
import { FormlyFormOptions, FormlyFieldConfig } from '@ngx-formly/core';
import { LanguageService, TranslationLoaderService } from '@app/shared/services';
import { ValidationLoader } from '@app/shared/services/validations.loader';

@Component({
selector: 'app-home',
@@ -35,9 +36,11 @@ export class HomeComponent {
constructor(
private languageService: LanguageService,
private translate: TranslateService,
private validationsLoader: ValidationLoader,
private translationLoader: TranslationLoaderService) {

this.translate.use('en');
this.translationLoader.loadTranslations();
this.validationsLoader.init();
}
}
@@ -0,0 +1,3 @@
export * from '@app/shared/custom-wrappers/card-wrapper/card-wrapper.component';
export * from '@app/shared/custom-wrappers/repeat-section/repeat-section.component';
export * from '@app/shared/custom-wrappers/img-radio-type/img-radio-type.component';

This file was deleted.

@@ -2,3 +2,4 @@ export * from '@app/shared/services/request.service';
export * from '@app/shared/services/dict.service';
export * from '@app/shared/services/i18n/language.service';
export * from '@app/shared/services/i18n/translation-loader.service';
export * from '@app/shared/services/validations.loader';
@@ -0,0 +1,39 @@
import { FormlyFieldConfig, FormlyConfig } from '@ngx-formly/core';
import { TranslateService } from '@ngx-translate/core';
import { Injectable } from '@angular/core';

@Injectable()
export class ValidationLoader {
constructor(
private translate: TranslateService,
private formlyConfig: FormlyConfig) { }

init(): void {
//message without params
this.formlyConfig.addValidatorMessage('required', this.translate.instant('Validations.required'));

//message with params
this.formlyConfig.addValidatorMessage('minlength', (err, field) => this.minlengthValidationMessage(err, field, this.translate));
this.formlyConfig.addValidatorMessage('maxlength', (err, field) => this.maxlengthValidationMessage(err, field, this.translate));
this.formlyConfig.addValidatorMessage('min', (err, field) => this.minValidationMessage(err, field, this.translate));
this.formlyConfig.addValidatorMessage('max', (err, field) => this.maxValidationMessage(err,field, this.translate));
}

private minlengthValidationMessage(err, field: FormlyFieldConfig, translate: TranslateService) {
return translate.instant('Validations.minLength', { 'number': field.templateOptions.minLength});
}

private maxlengthValidationMessage(err, field: FormlyFieldConfig, translate: TranslateService) {
return translate.instant('Validations.maxLength', { 'number': field.templateOptions.maxLength});
}

private minValidationMessage(err, field: FormlyFieldConfig, translate: TranslateService) {
return translate.instant('Validations.min', { 'number': field.templateOptions.min});
}

private maxValidationMessage(err, field: FormlyFieldConfig, translate: TranslateService) {
return translate.instant('Validations.max', { 'number': field.templateOptions.max});
}
}


This file was deleted.

@@ -12,6 +12,17 @@
"remove": "Remove"
}
},
"Validations": {
"minLength": "Should have at least {{number}} characters",
"maxLength": "This value should be less than {{number}} characters",
"min": "This value should be more than {{number}}",
"max": "This value should be less than {{number}}",
"required": "This field is required",
"cardIDLength" : "Card ID length is 5 characters",
"cardNotExist" : "This Card ID does not exist please check your identification card",
"cardTokenLength": "Card Token length is 5 characters",
"emailCheck": " is not a valid email address"
},
"RequestToConcierge": {
"orderIdentification": "Order Identification",
"orderType": "Order Type",
@@ -47,11 +58,5 @@
"phoneNo": "Confirm phone number",
"email": "Confirm email",
"acceptTermsDesc": "In order to proceed, please accept terms"
},
"Validations": {
"cardIDLength" : "Card ID length is 5 characters",
"cardNotExist" : "This Card ID does not exist please check your identification card",
"cardTokenLength": "Card Token length is 5 characters",
"emailCheck": " is not a valid email address"
}
}
@@ -12,6 +12,17 @@
"remove": "Usuń"
}
},
"Validations": {
"minLength": "Ilość znaków musi być większa niż {{number}}",
"maxLength": "Ilość znaków nie może przekraczać {{number}}",
"min": "Wartość nie powinna bvć niższa niż {{number}}",
"max": "Wartość nie powinna być wyższa niż {{number}}",
"required": "Pole wymagane",
"cardIDLength" : "ID Karty powinno mieć 5 znaków",
"cardNotExist" : "Podane ID Karty nie isnieje, sprawdź swoje dane identyfikacyjne",
"cardTokenLength": "Ilość znaków tokenu karty to 5 znaków",
"emailCheck": " jest niepoprawnym adresem email"
},
"RequestToConcierge": {
"orderIdentification": "Identyfikacja zamówienia",
"orderType": "Typ zamówienia",
@@ -47,11 +58,5 @@
"phoneNo": "Potwierdź numer telefonu",
"email": "Potwirdź adres email",
"acceptTermsDesc": "Aby przejść dalej, proszę przeczytaj i potwierdź oświadczenia"
},
"Validations": {
"cardIDLength" : "ID Karty powinno mieć 5 znaków",
"cardNotExist" : "Podane ID Karty nie isnieje, sprawdź swoje dane identyfikacyjne",
"cardTokenLength": "Ilość znaków tokenu karty to 5 znaków",
"emailCheck": " jest niepoprawnym adresem email"
}
}

0 comments on commit 8b23fc4

Please sign in to comment.
You can’t perform that action at this time.