Expression 'email&validate' is not compatible with the validate binding-behavior.

[ma3yta]

I got error Expression 'email&validate' is not compatible with the validate binding-behavior.

import {ValidationController, validateTrigger} from 'aurelia-validation';
import {required, email, ValidationRules, length} from 'aurelia-validatejs';
import {AuthService} from 'aurelia-auth';
import {autoinject} from 'aurelia-framework';
import {EventAggregator} from 'aurelia-event-aggregator';
import {notificationService} from "services/notificationService";
import 'jquery';

@autoinject
export class Login {
    errorMessage: string = "";
    errors: boolean = true;
    reporter: any;

    @required()
    @email()
    public email: string = "";
    @required()
    @length({ minimum: 5 })
    public password: string = "";

    constructor(public auth: AuthService, private controller: ValidationController, private ea: EventAggregator, private notificationService: notificationService) {
        //this.controller.validateTrigger = validateTrigger.change;  
    }
}

<form role="form" class="centered-holder" submit.delegate="login()"
                        validation-renderer="bootstrap-form"
                        validation-errors.bind="errors">
                            <h2 class="step-title">
                                <span>Please Login</span>
                            </h2>
                            <div class="mark-text">
                                <span>Welcome to NowInfinity</span>
                            </div>
                            <span id="login-error" style="display:none;" class="btn-validation validation-error">
                                <span class="no-valid">${errorMessage}</span>
                            </span>
                            <div class="step-form-area">
                                <div class="information">
                                    <h2 class="information-title">login Form</h2>

                                    <div class="information-row">
                                        <div class="form-block">
                                            <label for="email">Email Address:</label>
                                            <div class="form-input">
                                                <input name="email" class="form-input-hidden" value.bind="email & validate">
                                            </div>
                                        </div>
                                    </div>

                                    <div class="information-row">
                                        <div class="form-block">
                                            <label for="password">Password:</label>
                                            <div class="form-input">
                                                <input name="password" class="form-input-hidden" type="password" value.bind="password & validate" placeholder="">
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div class="btn-row">
                                <button type="submit" class="btn">Login</button>
                                <button if.bind="isLocalhost()" click.delegate="authenticate('nowinfinity')" class="btn">Login Nowinfinity</button>
                                <a class="btn" route-href="route: basic-information;">Sign Up</a>
                            </div>
                        </form>

[ma3yta]

The code flows into this method and fails every test, despite the expression.expression being class AccessScope:

  function getPropertyInfo(expression, source) {
    var originalExpression = expression;
    while (expression instanceof _aureliaBinding.BindingBehavior || expression instanceof _aureliaBinding.ValueConverter) {
      expression = expression.expression;
    }

    var object = void 0;
    var property = void 0;
    if (expression instanceof _aureliaBinding.AccessScope) {
      object = source.bindingContext;
      property = expression.name;
    } else if (expression instanceof _aureliaBinding.AccessMember) {
      object = getObject(originalExpression, expression.object, source);
      property = expression.name;
    } else if (expression instanceof _aureliaBinding.AccessKeyed) {
      object = getObject(originalExpression, expression.object, source);
      property = expression.key.evaluate(source);
    } else {
      throw new Error('Expression \'' + originalExpression + '\' is not compatible with the validate binding-behavior.');
    }

    return { object: object, property: property };
  }
});

@jdanyow Apparently expression, a BindingBehavior object, is not an instance of _aureliaBinding.BindingBehavior. I would think it should be, no?

[jdanyow]

you have forks- jspm inspect --forks

[ma3yta]

https://gyazo.com/295d97a29eecbb20908e7ba063ddca98

[jdanyow]

yep- so now you should jspm install every aurelia dependency in your package.json to bring everything up to date. This will resolve the issue.