如何在 `router` 中观察指定的 `properties` 并做出相应的反应？

Question

在我的应用中，用户设置了 6 个独立的数字。他们可以 delete/re-enter/enter 输入值。控制器将此值发送到路由器。

当路由器监视所有这些属性时，它将把用户带到下一页。我的问题是如何观察属性（指定的属性）并做出相应的反应？

这是我的路由器代码（片段）：

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

据我了解你的代码，你可以简单地创建一个 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');
    }
}

我建议你创建一个地图或其他东西，你的代码往往很快就会变得无法维护。

Answer 2

如果我是你，我会将此逻辑移至控制器。您应该考虑使用 Ember computed function /observer 来观察用户输入的值，并在输入完成时触发操作。

在这种情况下，如果你想转换到路由，你可以使用 transitionToRoute() 钩子 - API 或者你可以从控制器发送一个动作到路由

如何在 `router` 中观察指定的 `properties` 并做出相应的反应？

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

ember.js

ember-data