controller - 防止在 Ember.js 中使用重定向 Hook 时执行路由

Question

我正在用 Ember.js 制作一个应用程序。这是一个小测验，其中问题与图片一起显示，同时在音频播放器中播放，一个接一个。当一个问题被回答时，下一个问题通过转换到 questionRoute 来显示，下一个问题作为模型。

为了防止用户使用浏览器后退按钮，我检查问题是否已经在我的问题路由的重定向功能中完成。在这种情况下，我将它们转换回下一个问题。

那行得通，但是函数 setupController 仍然会为我刚刚重定向的已完成问题执行。这会导致在音频播放器中再次播放已完成的问题，并且同时播放新问题。

有没有办法阻止路由在重定向后进一步执行 setupController() 和 renderTemplate() ？

现在我使用自己的变量来查看路由是否已被重定向，但这感觉像是一种骇人听闻的方式，如果有更好的方法，我现在想这样做。

这是我的代码:

//question route

Player.QuestionRoute = Em.Route.extend({
    redirect: function(question){

        Player.Quiz.setCurrentQuestion(question);

        nextQuestion = Player.Quiz.getNextQuestion();

        if(question.get('finished') == true && nextQuestion != null) {
            this.transitionTo('question', nextQuestion);
            //hackish way to prevent the other functions from executing
            this.set('hasBeenRedirected', true);
            return;
        }

        //hackish way to prevent the other functions from executing
        this.set('hasBeenRedirected', false);

    }, 
    setupController: function(controller, model){
        //hackish way to prevent the other functions from executing
        if(this.get('hasBeenRedirected') == true) return;
        controller.set('content', model);

        /* do some other things */

        controller.startQuestion();
    },
    renderTemplate: function(controller, model) {
        //hackish way to prevent the other functions from executing
        if(this.get('hasBeenRedirected') == true) return;

        this.render('stage'); 
        this.render('dock', {
            outlet: 'dock'
        }); 

        this.render(model.getPreferredTemplate(), {
            into: 'stage',
            outlet: 'question'
        });

        this.render("quizinfo", {
            into: 'stage',
            outlet: 'quizinfo',
            controller: this.controllerFor('quiz', Player.Quiz),
        });

    },
    model: function(param){
        return Player.Quiz.getQuestionAt(param.question_id);
    }

});

Answer 1

最新版本的 ember 已弃用 redirect赞成beforeModel和 afterModel钩子(Hook)。这使您可以更精细地控制用户输入路线时发生的情况，尤其是在前进/后退按钮的情况下。

App.QuestionRoute = Ember.Route.extend({
  afterModel: function(question, transition) {
    nextQuestion = Player.Quiz.getNextQuestion();
    if (question.get('finished') == true && nextQuestion != null) {
      this.transitionTo('question', nextQuestion);
    }
  }
});

要使用这些新钩子(Hook)，您需要使用 ember-latest。看看 this gist有关更改的详细信息。