2013-10-19 16 views
0

我正在使用require.js骨幹和backbone.localstorage,我想弄清楚如何使用數據後調用fetch,不知道如何去做...我試圖將數據傳遞到我的看法和利用它。如何在調用fetch時使用數據?

下面是存儲在localStorage的數據的例子:

[{"artist":"Hits 1 Entertainment 4-1-1","title":"Hear Katy's Perry's New Album!"}, ...] 

所以它是一個數組中的對象。

這是我爲骨幹的代碼...

var songz = new Songs(); 
songz.localStorage = new Backbone.LocalStorage("music"); 
songz.fetch({dataType: 'json'}); 
var songV = new SongV({collection: songz}); 
songV.render(); 

歌是一家集,看起來像這樣在集合文件,SongV是爲每首歌曲的看法。

這裏是上面的代碼的視圖包括:

define([ 
    'jquery', 
    'underscore', 
    'backbone', 
    'models/song', 
    'collections/songs', 
    'views/song', 
    'text!templates/page.html' 

], function($, _, Backbone, Song, Songs, SongV, PageT){ 

    var Page = Backbone.View.extend({ 

    el: $("#page"), 
    render: function() { 
     this.$el.html(PageT); 

     var songz = new Songs(); 
     songz.localStorage = new Backbone.LocalStorage("music"); 
     songz.fetch({dataType: 'json'}); 
     var songV = new SongV({collection: songz}); 
     songV.render(); 



    } 


    }); 
    return Page; 
}); 

這裏是集合文件:

define([ 
    'jquery', 
    'underscore', 
    'backbone', 
    'models/song', 
], function($, _, Backbone, Song){ 

    var Songs = Backbone.Collection.extend({ 
     model: Song, 

    initialize: function() { 
    } 
    }); 
    return Songs; 
}); 

下面是該模型的文件:

define([ 
    'underscore', 
    'backbone' 
], function(_, Backbone) { 

    var Song = Backbone.Model.extend({ 

    }); 
    return Song; 
}); 

這裏是模板文件:

<tr> 
    <th> Number </th> 
    <th> Title </th> 
    <th> Artist </th> 
    <th> Date_Added </th> 
    <th> Video </th> 
</tr> 
    <% _.each(songs, function(song){ %> 
    <tr> 
    <td> <%= song.get("number") %> </td> 
    <td> <%= song.get("title") %> </td> 
    <td> <%= song.get("artist") %> </td> 
    <td> <%= song.get("added_on") %> </td> 
    <td> <%= song.get("video") %> </td> 
    </tr> 
    <% }); %> 

回答

0

您需要獲取並綁定到集合上的重置事件,以查看它何時成功從服務器上拉取數據。

Page = Backbone.View.extend 
el: $('#page') 
render: -> 
    songz = new Songs() 
    # Initialize view 
    songV = new SongV({collection: songz}) 
    # Render view 
    songV.render() 
    # Fetch collection 
    songz.fetch() 

SongV = Backbone.View.extend 
    initialize: -> 
    @listenTo @collection, "reset", @onReset 
    onReset: (collection) -> 
    # Use populated collection data 
    ... 

Songs = Backbone.Collection.extend 
    model: Song 
    localStorage: new Backbone.LocalStorage("music") 
    initialize: -> 

這是收藏品和模型店如何Backbone.LocalStorage - >here
見表格底部,對於鏈塊,關鍵是你本地存儲的名稱,然後每個模型都有一個唯一的密鑰。

所以這意味着如果你有自己的本地存儲的數據,你應該使用跨瀏覽器的本地存儲設備如store.js,然後用它來填充你的Backbone.Collection。

或者,您可以從服務器獲取(推薦),並將填充您的收藏。或者您可以在頁面加載數據bootstrap並以此方式重置您的收藏。

+0

無論如何,你可以編輯,以正常的JavaScript:/我會盡快學習咖啡的腳本,但它有點難以理解... – Lion789

+0

只要去這裏複製粘貼 - http://js2coffee.org/# coffee2js – imrane

相關問題