0

Backbone.js は初めてです。チュートリアルに従って、自分のニーズに合わせようとしています。
コレクションに挿入する複数のオブジェクトを取得するために、アプリのメイン ビューから fetch メソッドを呼び出しています。json データが返され、フェッチ関数は成功を返しますが、コレクションに値が入力されていないことをクロムで確認できます。

レンダリングには IcanHaz を使用しています。Job モデルで定義したデフォルト モデルのみが出力されます。

 var Job = Backbone.Model.extend({
   defaults: {
        title: 'Not specified',
        status: 0,
        created_at: 'Not specified'
    }
 });


var JobView = Backbone.View.extend({
   render: function () {
        // template with ICanHaz.js (ich)
        this.el = ich.jobRowTpl(this.model.toJSON());
        return this;
    }
});

// define the collection of jobs
var JobCollection = Backbone.Collection.extend({
    model: Job,
    url: '/api/1.0/jobs/'
});


// main app, the collection view
var AppView = Backbone.View.extend({
    tagName: 'tbody', 

    initialize: function() {
        this.jobs = new JobCollection();
        this.jobs.on('all', this.render, this);
        this.jobs.fetch({
                           error: function () {
                             console.log("error!!"); 
                           },
                           success: function () {
                              console.log("no error"); 
                           }
                        }).complete(function () {
                            console.log('done');
                            console.log('length1:' +  this.jobs.length);
                        });
       console.log('length2: '+ this.jobs.length);
    },

    render: function () {
        this.jobs.each(function (job) {
            var tmpjob = new JobView({model: job}).render().el;
            $(this.el).append(tmpjob);
            console.log('job': + this.tmpjob);
        }, this);

        return this;
    }


});

var app = new AppView();
$('#app').append(app.render().el);

Chrome コンソールでは、次のように表示されます。

length2:0
job:undefined 
no error 
done 
Uncaught TypeError: Cannot read property 'length' of undefined //referring to the lenght1 logging

これらは、network/xhr/response の下の chrome インスペクターから取得したデータです。

{"count": 2, "next": null, "previous": null, "results": [{"id": 1, "title": "testAlbum", "status": 0, "created_at": "2012-12-31"}, {"id": 2, "title": "testAlbum2", "status": 0, "created_at": "2012-12-31"}]}


fetch メソッドを呼び出した後に 'jobs' コレクションが存在する理由がわかりませんが、'success' ヘルパーが呼び出されたときに fetch ブロック内で定義されていません。

また、成功を返し、json データがサーバーから返されたにもかかわらず、コレクションに値が設定されていないのはなぜですか?

私はかなり迷っています。

4

1 に答える 1

4

配列parseを返すだけのメソッドをコレクションに追加します。resultsコレクションは、JSON 応答全体ではなく、モデルの配列である必要があります。

バックボーンのドキュメントでは、 の使用方法が説明されていますparse。

于 2013-01-08T02:48:20.007 に答える