抓取目錄內容到主幹中的json

我有包含圖像的文件夾;我打電話獲取的文件夾上傳/我用HTML以下響應（無JSON等）抓取目錄內容到主幹中的json

<h1>Index of /backbone_images/uploads</h1> 
<ul><li><a href="/backbone_images/"> Parent Directory</a></li> 
<li><a href="2012-12-11%2015.30.221.jpg"> 2012-12-11 15.30.221.jpg</a></li> 
<li><a href="ian1.jpg"> in1.jpg</a></li> 
<li><a href="imagedummy.png"> imagedummy.png</a></li>

GET回報我嘗試呈現/我讀入數據到模型等與下面的代碼：

window.Person = Backbone.Model.extend({}); 

window.AddressBook = Backbone.Collection.extend({ 
    url: 'uploads/',// declare url in collection 
    model: Person 
}); 

    window.Addresses = new AddressBook(); 

    window.AppView = Backbone.View.extend({ 
     el: $('#left_col'), 
     initialize: function() { 
      Addresses.bind('reset', this.render); // bind rendering to Addresses.fetch() 
     }, 
     render: function(){ 
      console.log(Addresses.toJSON()); 
     } 
    }); 

    window.appview = new AppView(); 
    Addresses.fetch();

但是沒有任何東西正在呈現或附加到我的左列：所以 - >我可以從包含這樣的圖像目錄中獲取？另外我能做些什麼與HTML響應，我怎麼可以加載到模型，使其呈現等（如果有任何方法）？

來源

2013-02-21 IanO.S.

你取HTML？ – steveax 2013-02-21 18:07:41

@steveax我顯然沒有做正確的事情，但我基本上試圖獲取目錄的內容，它返回的是上面的HTML – 2013-02-21 18:35:19

您應該更改HTML響應成JSON格式，以便Backbone可以正確地呈現它（儘管有一種顯示您上面的HTML的方法，這不是推薦的方法，因爲它更好地呈現原始數據）。

你可以做這樣的事情：

HTML：

<div id="container"> 
</div> 
<script id="template" type="text/html"> 
    <li><img src=<%- dir %><%- image %> /></li> 
</script>

的JavaScript：

$(function(){ 
    /** Your response object would look something like this. */ 
    var json = {'parent_directory': 
        {'dir_desc': 'Index of /backbone_images/uploads', 
     'images': [ 
      {'dir': '/images/', 'image': 'image1.jpg'}, 
      {'dir': '/images/', 'image': 'image2.jpg'}, 
      {'dir': '/images/', 'image': 'image3.jpg'} 
     ] 
    }}; 

    /** Create a simple Backbone app. */ 
    var Model = Backbone.Model.extend({}); 

    var Collection = Backbone.Collection.extend({ 
     model: Model 
    }); 

    var View = Backbone.View.extend({ 
     tagName: 'ul', 
     initialize: function() { 
      this.render(); 
     }, 
     template: _.template($('#template').html()), 
     render: function() { 
      _.each(this.collection.toJSON(), function(val){ 
       this.$el.append(this.template({ 
        image: val.image, 
        dir: val.dir})); 
      }, this); 
      return this; 
     } 
    }); 

    /** Create a new collection and view instance. */ 
    var newColl = new Collection(json.parent_directory.images); 
    var newView = new View({collection: newColl}); 
    $('#container').html(newView.el); 
});

來源

2013-02-21 23:01:05

這幾乎工作，但我在我的網頁瀏覽器頁面顯示，所以var json的設置等方面有些問題，問題還有，如果我正在從目錄中獲取數據，並且接收HTML，我可以使用相同的方法將其更改爲JSON？ – 2013-02-22 00:53:28

您需要更改服務器以發回'JSON'而不是'HTML'。確保你的'JSON'對象包含一個'Objects Array'作爲值的屬性，這樣你就可以遍歷它們。如果你需要渲染這些值，你還需要調用'toJSON（）'。 – 2013-02-22 01:10:22

你應該把它綁定到sync事件

此外，我更喜歡使用listenTo

this.listenTo(Addresses, 'sync', this.render)

來源

2013-02-21 16:44:29 neebz

我試圖添加this.listenTo（Addresses，'sync'，this。渲染），在我的初始化函數，我仍然得到同樣的問題，沒有模型正在加載從提取和沒有任何附加到身體 – 2013-02-21 16:54:56

抓取目錄內容到主幹中的json

回答

相關問題