奥雷利亚的登录页面

Question

i am an aurelia beginner, i'm trying to prepare a simple app with login page. But when i give validations, i am not able to setRoot for for login. because of the constructor is not allowing two arguments.con you please help me if there is any other way? find my code below for login.js.

import {inject,Aurelia} from 'aurelia-framework';
import {Validation} from 'aurelia-validation';
import {ensure} from 'aurelia-validation';
@inject(Aurelia)
export class Login{
    static inject() { return [Validation]; }
    heading='Login to Aurelia'
    constructor(Aurelia,validation)
    {
        this.aurelia=Aurelia;
        this.email='raja';
        this.password='12345';
        this.validation = validation.on(this)
            .ensure('email')
                  .isNotEmpty()
                  .hasMinLength(3)
                  .hasMaxLength(10)
            .ensure('password')
                  .isNotEmpty()
                  .hasMinLength(3)
                  .hasMaxLength(10) ;
    }
    Submit()
    {
        this.validation.validate() 
     .then( () => {

         if(this.email=='raja'&&this.password=='12345')
        {
        this.aurelia.setRoot();
    }
else
{
            alert(`Invalid Credentials`);
} 
});
}
}

Answer 1

Don't mix @inject with static inject... .

Change this:

import {inject,Aurelia} from 'aurelia-framework';
import {Validation} from 'aurelia-validation';
import {ensure} from 'aurelia-validation';
@inject(Aurelia)
export class Login{
    static inject() { return [Validation]; }
    heading='Login to Aurelia'
    constructor(Aurelia,validation)
    {
      ...
    }
    ...
 }

To this:

import {inject,Aurelia} from 'aurelia-framework';
import {Validation} from 'aurelia-validation';
import {ensure} from 'aurelia-validation';
@inject(Aurelia, Validation)
export class Login{
    heading='Login to Aurelia'
    constructor(aurelia, validation) {
      ...
    }
    ...
 }