javascript - ホットタオルテンプレートでlist.jsを使う方法

Question

私はホット タオル テンプレートを使用しており、list.js を使用してリストの結果をフィルター処理しようとしています。

バンドル構成に list.min.js ファイルを含め、index.html ファイルでも正しく参照しました。

次のようなビュー (leads.html) があります。

<div id="lead-article-list">
    <input class="search" type="text" />
    <ul class="list" data-bind="foreach: leads" >
        <li>
            <span data-bind="text: name" class="name"></span>
        </li>
        <li>
            <span data-bind="text: description" class="description"></span>
        </li>
    </ul>
</div>
<script type="text/javascript">
    var options = {
        valueNames: ['name', 'description']
    };
    var featureList = new List('lead-article-list', options);
</script>

そして、次のような対応するビューモデル (leads.js) があります。

define(['services/datacontext', 'durandal/plugins/router'],
    function (datacontext, router) {
        var leads = ko.observableArray();
        var activate = function () {
            return datacontext.getLeadArticles(leads, false);
        };
        var vm = {
            activate: activate,
            leads: leads
        };
        return vm;
    });

アプリケーションを実行すると、リストは正しく入力されますが、検索入力に何かを入力すると、フィルタリングが行われません。KnockoutJS に固有のものと、オブザーバブルを使用しているという事実が欠けているように感じます。

また、ビューの最後にあるスクリプトが実際にビューモデルのどこかにある必要があるかどうかもわかりません。

どんな助けでも大歓迎です。ありがとう！