2

我有三个模型（专辑、歌曲、艺术家），我想得到一个特定类型的列表。现在这个应用程序的后端有一个 API 端点（/browse），它获取两个参数（grenre(s) 和项目类型（'album'、'song' 或 'artist'）并输出 JSON。

我不确定是否需要为每个模型提供单独的 api 端点来查询，或者是否可以使用我现在拥有的后端。

另外，有没有复杂路由的好例子？该网站上的示例非常基本......

我正在考虑类似 /browse/(albums | Artists | song)/genre+genre+genre/(rating | trending | listens) 之类的东西（这将是我将三个参数发送回服务器以获取项目类型，流派（多个是可选的，我必须在路线中做一些正则表达式）和sortby）。

更新：这就是我所拥有的。

var Chart = Spine.Controller.sub({
events: {
    'click .chart_clickthrough': 'chartNav',
    'change input.browse_switch': 'refreshChart',
    'change input.sort_switch': 'refreshChart'
},
browse: {
    url: '/api/chart',
    processData: true,
    data: {
        browse_object: 'song',
        sort: 'trending',
        genre: []
    }
},

init: function() {
    this.refreshChart();
},
render:function(model,sortby) {
    var items = model.all();
    if($('.chart_list').children.length > 0) {
        $('.chart_list').html('');
    }
    if(model) {
        //unbind the event for the model we aren't displaying. prevents the view from being updated too often
        Song.unbind('refresh');
        Artist.unbind('refresh');
        Album.unbind('refresh');

        model.bind('refresh', function() {
            chart.render(model,sortby);
        });
        for(var i = 0, l = items.length; i < l; i++) {
            //console.log(model.all()[i]);
            var template = $('#chartTpl').html(),
                data = items[i],
                html = Mustache.to_html(template, data);
            $('.chart_list').append(html);
        }
    }
},

refreshChart: function(e) {
    if(e) {
        e.preventDefault();
    }

    this.browse.data.browse_object = $('#BrowseOptions input[name=browse_object]:checked').val();
    this.browse.data.sort = $('#BrowseOptions input[name=sort]:checked').val();

    switch(this.browse.data.browse_object) {
        case 'album':   Album.fetch(this.browse);
                        this.render(Album,this.browse.data.sort);
                        break;
        case 'song':    Song.fetch(this.browse);
                        this.render(Song,this.browse.data.sort);
                        break;
        case 'artist':  Artist.fetch(this.browse);
                        this.render(Artist,this.browse.data.sort);
                        break;
    }
},

chartNav: function(e) {
    e.preventDefault();
    var attr = e.target.attributes,
        type = attr['data-type'].value,
        id = attr['data-id'].value,
        id2 = attr['data-album-id'].value;

    //console.log('clicked id: ' + id + ', type: ' + type + ', album id: ' + id2);
    if (type === 'Artist') {
        this.navigate('/artist',id);
    } else {
        var albumId = type === 'album' ? id : id2;
        this.navigate('/album', albumId);
    }

}
});
4

1 回答 1

2

将多个客户端 Spine.js 模型指向单个服务器端路由应该没问题。在您的客户端代码中，您需要做的是在每个 Spine.js 模型中指定它们应如何形成 URL 以联系服务器：

请参阅 http://spinejs.com/docs/ajax，例如：

Contact.extend({ url: "/users" });

在服务器端，您需要分别支持 C/R/U/D 路由上的 POST/GET/PUT/DELETE 操作，并解析参数以确定预期的模型。

于 2013-01-28T04:44:44.590 回答