3

私はバックボーンを初めて使用し、(オブジェクトの) JSON 配列をバックボーン コレクションに渡すときに何が起こっているのかについて非常に混乱しています。

Google ドライブでホストされているスプレッドシートから JSON を取得しています。コレクションで使用したい実際のデータは深くネストされているため、そのデータを解析しています。私の解析関数で、目的の配列の長さをログに記録すると、157 になります (これは正しいです)。次に、その配列をバックボーン コレクションに渡します。コレクションの長さは 1 (正しくありません) です。foo.bar.length = 157 のようですが、「foo」には「bar」が 1 つしかないため、コレクションに foo.bar を渡すと、foo.bar の内容ではなく foo.bar が取得されます。非常に混乱。

以下のコード...

var table = new TableView();

TableItem = Backbone.Model.extend(),

TableItemCollection = Backbone.Collection.extend( {
    model : TableItem,
    url : 'https://spreadsheets.google.com/feeds/list/0AjbU8ta9j916dFdjSVg3YkNPUUJnWkZSWjBDWmZab3c/1/public/basic?alt=json-in-script',
    sync : function( method, model, options ) {
        var params = _.extend( {
            type: 'GET',
            dataType: 'jsonp',
            url: this.url,
            processData: false
        }, options );
        return $.ajax( params );
    },
    parse : function( resp, xhr ) {
        console.log( resp.feed.entry.length ); // THIS LOGS 157
        return resp.feed.entry;
    }
} ),

TableView = Backbone.View.extend( {
    initialize  : function ( options ) {
        this.collection = new TableItemCollection();
        this.collection.on( 'reset', this.parseResponse, this );
        this.collection.fetch( {
            reset : true,
            success : function ( model, response, options ) {
                console.log( 'OK' );  // THIS LOGS 'OK'
            },
            error : function ( model, response, options ) {
                console.log( 'ERROR' );
            }
        } );
    },
    parseResponse : function () {
        console.log( this.collection.length ); // THIS LOGS 1
    }
} );
4

1 に答える 1

3

Google スプレッドシートから返された項目の 1 つをダンプすると、次のようにデータが複数のオブジェクトにネストされていることがわかります。

{
    "id":{"$t":"https://spreadsheets.google.com/feeds/list/..."},
    "updated":{"$t":"2013-07-30T12:01:24.000Z"},
    "category":[{"scheme":"...","term":"..."}],
    "title":{"type":"text","$t":"ACIW"},
    "content":{},
    "link":[{"rel":"self","type":"application/atom+xml","href":"..."}]
}

フィドルでhttp://jsfiddle.net/nikoshr/kHBvY/

idプロパティがオブジェクトにどのようにラップされているかに注意してください"id":{"$t":"https://spreadsheets.google.com/feeds/list/0AjbU8ta9j916dFdjSVg3YkNPUUJnWkZSWjBDWmZab3c/1/public/basic/cokwr"}

バックボーン コレクションは重複を許可せず、重複は ID に基づいて決定されます。すべてのアイテムが重複していると見なされ、1 つにまとめられます。ID を削除するか曖昧さをなくすと、157 個のアイテムが取得されます。例えば、

parse : function( resp, xhr ) {
    var data = resp.feed.entry, i;
    console.log(data.length); // THIS LOGS 157

    for (i=data.length-1; i>=0; i--)
        data[i].id  = data[i].id['$t'];

    return data;
}

http://jsfiddle.net/nikoshr/kHBvY/2/デモ用

髪を引っ張らない方法で使用するには、おそらくすべてのアトリビュートをアンラップする必要があります。

于 2013-08-01T12:54:36.477 に答える