Spine.js未知记录(可能是作用域错误?）

Spine.js Unknown Record (possible scope error?)

本文关键字：作用域 错误 js 未知 记录 Spine      更新时间：2023-09-26

如果我有一个"相册"列表，然后单击其中一个，我会导航到另一个视图（/#/album/：id），该视图由名为SingleAlbum的控制器控制。它可以正确地获取数据，但我无法将其渲染。我看过SO和Spine Google Group上的其他"未知记录"问题，但没有骰子。这是我的代码：

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.fund（id），但当我在var data = Album.find(id)上执行时，它失败了。这是范围问题吗？我是不是错过了一些显而易见的东西？

顺便说一句，请原谅我的代码太过冗长。我实际上正在制作一个SingleItem控制器，其中SingleArtist和SingleAlbum将是它的子类。我觉得这可能是个问题，所以我把代码拆开，自己测试。

编辑：具体来说，我的路线是这样的：

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

啊哈！我在事件处理程序中传递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);
}
相关文章：