1

「アルバム」のリストがあり、1 つをクリックすると、SingleAlbum というコントローラーによって制御される別のビュー (/#/album/:id) に移動します。データは正しくフェッチされますが、レンダリングできません。SO および Spine Google グループで他の「不明なレコード」の問題を調べましたが、サイコロはありません。これが私のコードです：

var SingleAlbum = Spine.Controller.sub({
    apiObj: {
        url: '/api/album',
        processData: true,
        data: {
            id: ''
        }
    },
    model: Album,
    panel: $('.album_single'),
    tmpl: $('#albumTpl'),

    init: function() {
        this.apiObj.url = this.model.url;
        if(this.panel.children.length > 0) {
            this.panel.html('');
        }
    },
    render: function(id) {
        console.log('render');

        var template = singleAlbum.tmpl.html(),
            data = Album.find(id), //  <--  this doesn't want to work
            html = Mustache.to_html(template, data);
        singleAlbum.panel.html(html);
    },
    getData: function(id) {
        //var me = this;
        console.log('get data');
        this.apiObj.data.id = id;
        this.apiObj.url = this.model.url;

        this.model.bind('refresh change', function(id) {
            //me.render(id);
            singleAlbum.render(id);
            console.log('should be rendered');
        });

        this.model.fetch(this.apiObj);
        console.log('record: ',this.model.find(id));
        if(Object.keys(this.model.find(id)).length > 0) {
            //this.render(id);
        }
    }   

});

イベントハンドラーで .render() を呼び出すと、問題が発生します。Album.all() にレコードがあり、Album.find(id) をアプリの他の場所で実行できることを手動で確認できますが、実行するvar data = Album.find(id)と失敗します。これは範囲の問題ですか？明らかな何かが欠けていますか？

ところで、私のコードの冗長さを許してください。私は実際に、SingleArtist と SingleAlbum がサブクラスになる SingleItem コントローラーを作成しています。それが問題かもしれないと思ったので、コードを取り出して、それ自体でテストしました。

編集: 具体的には、私のルートは次のようになります。

'/album/:id': function(params) {
    console.log('navigated to /album/', params.id);
    singleAlbum.getData(params.id);
}
4

1 に答える 1

0

あはは！id他の id 変数を上書きするイベント ハンドラーを渡していました。これは次のようになります。

render: function(id) {
        var template = this.tmpl.html(),
            data = this.model.find(id),
            html = Mustache.to_html(template, data);
        this.panel.html(html);
},
getData: function(id) {
        var me = this;
        this.apiObj.data.id = id;
        this.apiObj.url = this.model.url;

        this.model.bind('refresh change', function() {  //  <--  don't need to pass anything
            me.render(id);
        });

        this.model.fetch(this.apiObj);
}
于 2013-02-01T23:15:09.320 に答える