0

私は backbone.js をいじっていて、行き詰まりました。これが私のコードです：

window.Car = Backbone.Model.extend();
window.CarCollection = Backbone.Collection.extend( {
    model: Car,
    url:"../api/car/",

});

window.CarListView = Backbone.View.extend({
    tagName:'ul',

    initialize: function() {
        this.model.on("reset", this.render);
    },

    render: function (eventName) {
        console.log(this.model);        //is an object
        console.log(this.model.models); //is an empty array

        return this;
    },
});

 // Router
var AppRouter = Backbone.Router.extend({

    routes:{
        "":"list",
        "cars/:id":"carDetails"
    },

    list:function () {
        this.carList = new CarCollection();
        this.carListView = new CarListView({model:this.carList});
        this.carList.fetch();
        $('#sidebar').html(this.carListView.render().el);
    },

});

$(function () {
    app = new AppRouter();
    Backbone.history.start();
});

画像を投稿するのに十分な評判がないので、Chrome 開発者ツールのコンソールのテキスト バージョンを次に示します。

V r {length: 0, models: Array[0], _byId: Object, _events: Object, constructor: function…}
    > _byId: Object
    > _events: Object
    > length: 4
    > models: Array[4]
    > __proto__: s

私の問題は、空のモデルの背後に「隠されている」ように見える空でないモデルのプロパティにアクセスしようとしていることです。長さ 4 のモデル プロパティにアクセスするにはどうすればよいですか?

4

1 に答える 1

1

これはコンソールの癖ですが、ここでの中心的な問題は一般的です。データがロードされることを期待して、.fetch()(非同期ロード) を呼び出してからすぐに を呼び出しています。.render()データにアクセスするには、データがロードされるまで待つ必要があります。これを行うにはいくつかの方法がありますが、おそらく最も簡単な方法は、次のようにsuccessコールバックを渡すことfetchです。

var carListView = this.carListView;
this.carList.fetch({
    success: function() {
          $('#sidebar').html(carListView.render().el);
    }
});

console.logコレクションがまだロードされていないときに呼び出すと ( が表示されArray[0]ます)、ロードが完了した後に手動で検査されるため( が表示されます) 、コンソールはこれを奇妙にログに記録しますArray[4]。

于 2013-04-02T17:50:59.317 に答える