adding support for async validation

Author: matt-sanders

src/components/FormlyField.vue

@@ -54,12 +54,19 @@
 
          let valid = false;
          if ( typeof validator === 'function' ){
-           valid = !validator(field, model);
+           //valid = !validator(field, model);
+           // setup for async validation
+           validator(field, model, (asyncValid = false, asyncValidatorMessage = validatorMessage) => {
+             // whenever validation is done via a function we will assume it's asynchronous and will require next() to be called
+             // this way it doesn't matter if it's async or not, next() should always be called
+             console.log(this.form);
+             setError(this.form, this.field.key, validKey, !asyncValid, asyncValidatorMessage);
+           });
          } else {
            let res = new Function('model', 'field', 'return '+validator+';' );
            valid = !res.call({}, model, field);
+           setError(this.form, this.field.key, validKey, valid, validatorMessage);
          }
-         setError(this.form, this.field.key, validKey, valid, validatorMessage);
          
        });
      }

test/unit/specs/FormlyField.spec.js

@@ -269,8 +269,10 @@ describe('FormlyField', () => {
             key: 'search',
             type: 'test',
             validators: {
-              expression: function(field, model){
-                return model.search == 'test';
+              expression: function(field, model, next){
+                let valid = model.search == 'test';
+                next( valid );
+                //return model.search == 'test';
               }
             }
           }
@@ -286,6 +288,43 @@ describe('FormlyField', () => {
       },0);
     });
 
+    it('Async Validation', (done) => {
+      let data = {
+        form: {
+          $valid: true,
+          $errors: {}
+        },
+        model: {
+          search: 'testing'
+        },
+        fields: [
+          {
+            key: 'search',
+            type: 'test',
+            validators: {
+              asyncExpression: function(field, model, next){
+                console.log('--- first timeout here');
+                let valid = model.search == 'test';
+                setTimeout( function(){
+                  console.log('--------------- timeout here');
+                  next( valid );
+                }, 500);
+              }
+            }
+          }
+        ]
+      };
+
+      createValidField(data);
+      console.log('expression is ', vm.form.$errors.search.asyncExpression);
+      expect(vm.form.$errors.search.asyncExpression).to.be.true;
+      vm.model.search = 'test';
+      setTimeout(()=>{
+        //expect(vm.form.$errors.search.expression).to.be.false;
+        //done();
+      },1000);
+    });
+
     describe("Validation Messages", (done) => {
 
       //what do we want to do
@@ -331,6 +370,37 @@ describe('FormlyField', () => {
         expect(vm.form.$errors.search.validatorMessage).to.equal('Must equal test');
       });
 
+      it('Inline messages with a function', () => {
+        let data = {
+          form: {
+            $valid: true,
+            $errors: {}
+          },
+          model: {
+            search: 'testing'
+          },
+          fields: [
+            {
+              key: 'search',
+              type: 'test',
+              validators: {
+                validatorMessage:
+                {
+                  expression: function(field, model, next){
+                    let valid = model.search == "test";
+                    next(valid);
+                  },
+                  message: 'Must equal test'
+                }
+              }
+            }
+          ]
+        };
+
+        createValidField(data);
+        expect(vm.form.$errors.search.validatorMessage).to.equal('Must equal test');
+      });
+
       it('Inline messages with values parsed', () => {
         let data = {
           form: {