0

次のように、サーバーからモデルのコレクションを取得しました。

ビューの最初のモデルのみをレンダリングしたいのですが、レンダリングされたビューでユーザーがボタンをクリックすると、コレクションから次のモデルが順番にレンダリングされます。

ビュー全体をレンダリングしてから表示/非表示にすることはできません。これらはクイズの質問であり、人々はおそらくそのようにカンニングする方法を理解するでしょう!

私の現在の見解：

define([
    'domLib',
    'underscore',
    'backbone',
    'router',
    'config',
    'collection/quiz',
    'text!template/quiz.html'
    ],
    function($, _, Backbone, Router, AppConfig, QuestionList, QuizTemplate) {

        var QuizView = Backbone.View.extend({
            el: '[data-view="main-content"]',
            template: _.template(QuizTemplate),
            initialize: function onInitialize(param){
                this.collection = new QuestionList();
                this.collection.fetch({
                    reset: true,
                    data: {
                        categoryId: param.id || AppConfig.constants.CATEGORY,
                        limit: AppConfig.constants.QLIMIT
                    }
                });
                this.collection.bind('reset', this.render, this);
            },
            render: function onRender(){
                this.$el.html(this.template({questions: this.collection.toJSON()}));
            }
        });

        return QuizView;
});

私のコレクション; base64 デコードは、サーバーからのエンコードされた応答をデコードするためにあります。

define([
    'domLib',
    'underscore',
    'backbone',
    'router',
    'config',
    'model/quiz'
    ],
    function($, _, Backbone, Router, AppConfig, Quiz) {

        var QuestionList = Backbone.Collection.extend({
            model: Quiz,
            url: AppConfig.api.game.quiz,
            parse: function onParse(response){

                var self = this;

                _.each(response, function(obj, index){
                    _.each(obj, function(val, key, list){
                        if(key !== 'id'){
                            obj[key] = self.decode64(val);
                        }
                    });
                    self.push(obj);
                });

                return this.models;
            },
            decode64: function onDecode(data){

                var b64 = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=";
                var o1, o2, o3, h1, h2, h3, h4, bits, i = 0,
                    ac = 0,
                    dec = '',
                    tmp_arr = [];

                if (!data) {
                    return data;
                }

                data += '';

                do { // unpack four hexets into three octets using index points in b64
                    h1 = b64.indexOf(data.charAt(i++));
                    h2 = b64.indexOf(data.charAt(i++));
                    h3 = b64.indexOf(data.charAt(i++));
                    h4 = b64.indexOf(data.charAt(i++));

                    bits = h1 << 18 | h2 << 12 | h3 << 6 | h4;

                    o1 = bits >> 16 & 0xff;
                    o2 = bits >> 8 & 0xff;
                    o3 = bits & 0xff;

                    if (h3 == 64) {
                    tmp_arr[ac++] = String.fromCharCode(o1);
                    } else if (h4 == 64) {
                    tmp_arr[ac++] = String.fromCharCode(o1, o2);
                    } else {
                    tmp_arr[ac++] = String.fromCharCode(o1, o2, o3);
                    }
                } while (i < data.length);

                dec = tmp_arr.join('');

                return dec;
            }
        });

        return QuestionList;
});
4

1 に答える 1

1

@Loamhoofが述べたように、1つのアプローチは、コレクションにプロパティを追加し、インクリメントしてから返すcurrentQuestion何らかのgetNextQuestionメソッドを与えることです。currentQuestionthis.at(this.currentQuestion)

別のアプローチは、次のBackbone.Collection shiftメソッドを使用することです。

コレクションから最初のモデルを削除して返します。remove と同じオプションを取ります。

yourCollection.getNextQuestion()そのため、単に呼び出す代わりにyourCollection.shift(). ただし、これはコレクションを変更する (質問を削除するshift) ため、コレクションをさかのぼりたい場合は、おそらくアプローチを使用することをお勧めしますcurrentQuestion。

于 2013-04-25T21:09:37.160 に答える