Question

我正在使用Ember.js进行申请。这是一个小问答，其中问题与图片一起显示，同时在音频播放器中播放，一个接一个。当问题得到解答时，下一个问题将通过过渡到问题路径并将下一个问题作为模型来显示。

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

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

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

现在我使用自己的变量来查看路由是否已被重定向，但感觉就像一种hackish方式，如果有更好的方法，我现在想要。

这是我的代码：

//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

尝试将您的transitionTo放入Ember.run.next

 if(question.get('finished') == true && nextQuestion != null) {
        var _self = this;
         Ember.run.next(function() {
            _self.transitionTo('question', nextQuestion);
        });
        return;
     }

Answer 2

最新版本的ember已弃用redirect，转而使用beforeModel和afterModel个钩子。这使您可以更精细地控制用户进入路线时发生的情况，特别是在前进/后退按钮的情况下。

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

要使用这些新的钩子，你需要使用最新的ember。有关更改的详细信息，请查看this gist。

在Ember.js中使用重定向挂钩时，防止执行路由

2 个答案: