2

3 つのモデル (アルバム、曲、アーティスト) があり、特定のジャンルのそれぞれのリストを取得したいと考えています。現在、このアプリのバックエンドには 1 つの API エンドポイント (/browse) があり、2 つの引数 (grenre(s) とアイテムの種類 ('album'、'song'、または 'artist')) を取得し、JSON を吐き出します。

クエリを実行するモデルごとに個別の API エンドポイントが必要かどうか、または現在持っているバックエンドを使用できるかどうかはわかりません。

また、複雑なルーティングの良い例はありますか? サイトの例は非常に基本的なものです...

/browse/(albums | artist | song)/genre+genre+genre/(rating | trending | listens) のようなものを考えています (これは、アイテムの種類を取得するためにサーバーに送り返す 3 つの引数になります) 、ジャンル（複数はオプションです。ルートで正規表現を実行する必要があります）、および並べ替え）。

更新：これが私が持っているものです。

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 に答える