updated readme, updated public api

Author: Sergey Netyaga

README.md

@@ -2,6 +2,21 @@
 
 > Idea was taken from [Bean Validation](https://beanvalidation.org/)
 
+1. [Supports](#supports)
+2. [Install](#install)
+3. [What is the problem?](#what-is-the-problem)
+4. [Contains](#contains)
+5. [Does not support](#does-not-support)
+6. [Contributing](#contribution)
+
+## Supports
+From Angular 5.
+
+## Install
+Install with npm
+
+`npm install ngx-bean-validation --save-dev`
+
 ## What is the problem?
 
 Reactive forms are very powerful, but they become painful for big forms:
@@ -109,6 +124,7 @@ Now we can use our classes as interface and reuse them for reactive forms.
 This library provides `BeanFormGroup` class for creation `FormGroup` from annotated classes.
 
 ### Annotations for default angular validators:
+* Email
 * Max
 * MaxLength
 * Min
@@ -133,13 +149,26 @@ This library provides `BeanFormGroup` class for creation `FormGroup` from annota
 ## How to use:
 Example how to create your own validator annotation:
 ```typescript
+import {AbstractControl, ValidationErrors, ValidatorFn} from '@angular/forms';
+import {setSyncValidator, AnnotationFunction} from 'ngx-bean-validation';
+
+const customAngularValidator = (someValue: any): ValidatorFn => {
+  return (control: AbstractControl): ValidationErrors => {
+    return {
+      custom: 'Custom validator'
+    };
+  };
+};
+
 export const CustomValidator = (someValue: any): AnnotationFunction => (target: object, key: string): void => {
   setSyncValidator(target, key, customAngularValidator(someValue));
 };
 ```
 
 Now you can put it in your class:
 ```typescript
+import {CustomValidator} from './custom-validator';
+
 class User {
   @CustomValidator('someValue')
   name: string
@@ -148,12 +177,16 @@ class User {
 
 And create form group:
 ```typescript
+import {FromGroup} from '@angular/forms';
+import {User} from './user';
+import {BeanFormGroup} from 'ngx-bean-validation';
+
 class Component {
   userForm: FromGroup = new BeanFormGroup(new User())
 }
 ```
 
-## Does`t support
+## Does not support
 * Async validators
 * FormControl and FormArray them self, only inside FormGroup
 

projects/ngx-bean-validation/src/lib/annotations/empty-control.ts

@@ -2,9 +2,7 @@
 import {AnnotationFunction, checkAnnotationConflicts, FormMetadata, setName} from './common';
 
 /**
- * If you don`t need to validate field, just use this annotation, otherwise you will not get formControl in ControlConfig
- * @returns {AnnotationFunction}
- * @constructor
+ * If you don`t need to validate field, just use this annotation, otherwise you will not get formControl in the ControlConfig
  */
 export const EmptyControl = (): AnnotationFunction => (target: any, key: string) => {
   let metadata = Reflect.get(target, setName(key)) as FormMetadata;

projects/ngx-bean-validation/src/lib/annotations/index.ts

@@ -3,4 +3,17 @@
  */
 
 export * from './lib/bean-form-group';
-export * from './lib/annotations';
+export * from './lib/annotations/disabled';
+export * from './lib/annotations/empty-control';
+export * from './lib/annotations/max';
+export * from './lib/annotations/email';
+export * from './lib/annotations/max-length';
+export * from './lib/annotations/min';
+export * from './lib/annotations/min-length';
+export * from './lib/annotations/nested';
+export * from './lib/annotations/nested-array';
+export * from './lib/annotations/required';
+export * from './lib/annotations/required-true';
+export * from './lib/annotations/pattern';
+export {setSyncValidator, AnnotationFunction} from './lib/annotations/common';
+

projects/ngx-bean-validation/src/public_api.ts

@@ -25,6 +25,7 @@
                [class.is-invalid]="password.invalid"
                formControlName="password"
                placeholder="Password">
+        {{password.errors | json}}
       </div>
       <div class="form-group form-check">
         <input type="checkbox"

src/app/app.component.html

@@ -1,9 +1,26 @@
 import {Component} from '@angular/core';
-import {FormGroup} from '@angular/forms';
-import {Email} from '../../projects/ngx-bean-validation/src/lib/annotations/email';
-import {MaxLength, MinLength, Required, RequiredTrue} from '../../projects/ngx-bean-validation/src/lib/annotations';
-import {Pattern} from '../../projects/ngx-bean-validation/src/lib/annotations/pattern';
-import {BeanFormGroup} from '../../projects/ngx-bean-validation/src/lib/bean-form-group';
+import {AbstractControl, FormGroup, ValidationErrors, ValidatorFn, Validators} from '@angular/forms';
+import {BeanFormGroup, Pattern, Email, MaxLength, RequiredTrue, MinLength, setSyncValidator, AnnotationFunction} from 'ngx-bean-validation';
+
+const customRequired = (): ValidatorFn => {
+  return (control: AbstractControl): ValidationErrors => {
+    if (control.valid) {
+      const validationError = Validators.required(control);
+
+      if (validationError) {
+        return {
+          required: 'Custom required'
+        };
+      }
+    }
+
+    return null;
+  };
+};
+
+export const CustomRequired = (): AnnotationFunction => (target: object, key: string): void => {
+  setSyncValidator(target, key, customRequired());
+};
 
 class User {
   @Email()
@@ -12,7 +29,7 @@ class User {
   @Pattern(/^(?=.*\d)(?=.*[a-z])(?=.*[A-Z])(?!.*\s).*$/)
   @MaxLength(24)
   @MinLength(4)
-  @Required()
+  @CustomRequired()
   password: string;
 
   @RequiredTrue()

src/app/app.component.ts

@@ -18,12 +18,6 @@
       "dom"
     ],
     "paths": {
-      "ng-bean-validation": [
-        "dist/ng-bean-validation"
-      ],
-      "ng-bean-validation/*": [
-        "dist/ng-bean-validation/*"
-      ],
       "ngx-bean-validation": [
         "dist/ngx-bean-validation"
       ],
@@ -32,4 +26,4 @@
       ]
     }
   }
-}
+}