Question

我正在制作一个练习应用程序，逐个向用户显示问题。当用户解决问题时，他将转换到下一个问题。问题可以是不同类型（例如，多选，连接匹配等）。每个问题都有一个用于渲染它的首选视图。当问题被解决时，它的属性已设置为true。我在问题视图中观察到该属性已从问题中完成，当设置为true时，视图会自动向用户显示正确的答案。

当用户点击浏览器后退按钮返回上一个问题时，将执行路径中的setup-controller方法，其中当前模型设置为先前的模型。该模型的观察者看到问题已经完成，并试图显示正确的答案，但视图尚未改变。

所以会发生的是匹配问题试图在canvas-element上绘制点和线来显示答案，在多选择视图中（没有画布......）

我希望后退按钮能正常工作，因此用户可以返回并查看他犯了哪些问题是对错，并查看解决方案。

很明显，我的流程中有些错误，但我看不出究竟需要改变什么

这是我在路由器上的代码：

// Player.EI is my exercise instance, 
// an Ember Exercise class which has questions, holds score, etc... 

Player.Router.map(function() {
    this.resource('index', {path: "/"});
    this.resource('question', {path: "question/:question_id"});
});

Player.IndexRoute = Em.Route.extend({
    setupController: function(controller, model){
        this.controllerFor('application').loadExerciseData(); //from xml file
    }
});

Player.QuestionRoute = Em.Route.extend({
    beforeModel: function(transition){
        if(undefined === Player.EI){
            this.controllerFor('application').loadExerciseData(transition.params.question_id);
            transition.abort();
            return;
        }
    },
    afterModel: function(model, transition){
        Player.EI.setCurrent(model);
    }, 
    setupController: function(controller, model){
        // the dock is a panel at the bottom of the application, 
        // with buttons to submit and navigate

        d = this.controllerFor('dock');
        d.set('currentQuestion', Player.EI.getCurrent());
        d.set('next', Player.EI.getNext());
        d.set('previous', Player.EI.getPrevious());
        d.set('elements', Player.EI.getElements());

        cn = this.controllerFor(model.getController());

        //this causes the views to do DOM-actions, while in the wrong template
        cn.set('content', model); 

        //do init stuff with the question, like play audio
        cn.enter(); 

        //add a reference to the dock in the controller
        cn.set('dock', d);

        //add a reference to the controller in the dock
        d.set('currentQuestionController', cn);
    },
    renderTemplate: function(controller, model) {

        this.render('stage'); 

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

        //each question can tell what controller it needs
        cn = this.controllerFor(model.getController(), model);

        //each question can tell what view it needs to display it
        this.render(model.getPreferredTemplate(), {
            into: 'stage',
            outlet: 'question',
            controller: cn,
            content: model
        });

        //Exercise title,...
        this.render("exerciseinfo", {
            into: 'stage',
            outlet: 'exerciseinfo',
            controller: cn,
            content: model
        });
    }, 
    model: function(param, transition){
        return Player.EI.getElement(param.question_id); 
    }
});

路由＆amp;使用浏览器后退按钮时在Ember JS中呈现问题

0 个答案: