按類型排序在ractive

我遇到教程部分：http://learn.ractivejs.org/list-sections/5/按類型排序在ractive

與選擇和排序嘗試。

Ractive模板

<th class='sortable {{ sortColumn === type ? "sorted" : "" }}' on-tap='sort:type'> 
    <div class="industry select"> 
     <select> 
     {{#each type}} 
      <option> {{this}} </option> 
     {{/each}} 
     </select> 
    </div> 
</th>

HTML

<div data-list></div>

Ractive腳本

var type = ['Cat', 'Dog', 'Hamster']; 
var ractive = new Ractive({ 
    el: document.querySelector('[data-list]'), 
    template: '#list-container', 
    data: { 
    type: type, 
    sort: function (array, column) { 

      return array.sort(function (a, b) { 
      return a[ column ] - b[ column ]; 
    }); 
    }, 
    sortColumn: 'type' 
    } 
})

希望能夠選擇任何類型，然後它按類型，說貓;它會列出貓和名單與狗和倉鼠。

任何有識之士/幫助拉羅讚賞！

更新

JSFIDDLE DEMO

目前，它不因爲動物實驗和排序是不正確的，我認爲

來源

2014-09-30 joe

它看起來像你需要設置雙向<select>元素結合，以便Ractive知道sortColumn的值應爲：

<select value='{{sortColumn}}'> 
    {{#each type}} 
    <option>{{this}}</option> 
    {{/each}} 
</select>

來源

2014-09-30 18:38:04

似乎沒有做任何事情......可能{{sortColumn ===類型？「sorted」：「」}}是不正確的？ – joe 2014-10-01 02:36:48

在你的例子中，'type'是一個數組，所以這肯定不起作用。你可以發佈一些示例數據和完整的模板（理想情況下在JSFiddle中，因此很容易調試和分叉 - [這裏是模板]（http://jsfiddle.net/rich_harris/va6jU/））？如果沒有這些，很難理解 – 2014-10-01 03:09:00

我在上面做了jsfiddle，但結果仍然相同 - 動物不能排序，如果選擇貓，它會顯示所有的貓和其他貓只在貓後排隊。是否有解決方法？ – joe 2014-10-01 15:07:10

按類型排序在ractive

回答

相關問題