how to watch specified `properties` in `router` and react accordinlgy?

Question

In my app, user setting the 6 seperate digits. they can delete/re-enter/enter the values in input. controller sending this values to router.

when router watches all this properties, then it will take user to next page. my question is how to watch the properties ( specified properties ) and react accordingly?

here is my router code ( snippet ):

export default Ember.Route.extend({
    otp1:null,
    otp2:null,
    otp3:null,
    otp4:null,
    otp5:null,
    otp6:null,

    myWatcher(){
        console.log('all properties are available, enable next');
    },

    setupController(controller,model) {
        this._super(...arguments);
        this.controllerFor('auth-page.credit-card.credit-cardno').set('enableNext', false); 
    },

    actions:{
        setupCardNumber( number, index ){
            this.set('opt'+index, number ); //setting values
            console.log( 'setting', this.get('opt'+index) );//gets property
        }
    }
}

Answer 1

As far as I understand your code, you could simply create an if-statement:

setupCardNumber( number, index ){
    if (this.get('otp1') &&
        this.get('otp2') &&
        this.get('otp3') &&
        this.get('otp4') &&
        this.get('otp5') &&
        this.get('otp6') ) {
        this.transitionTo('next-page');
    }
}

I would advice you to create a map or something, your code tends to get unmaintainable rather quickly.