2

サイト アプリに Typeahead を実装しようとしていますが、これまでにいくつかの問題が見つかりました。最初のことは、サーバー側から先行入力に送信したレコードについてです。複数の行を取得しても、1 行しか表示されません。

私の環境は次のとおりです。

  • Node.JS;
  • Jade テンプレート エンジンで表現します。
  • ブートストラップ
  • モンゴDB。

サーバー側では、mongo が出力配列にフェッチするすべての行を追加します。

        docs.forEach(function(e) {
            output.push({
                _id:e._id,
                name:e.name,
                date:e.dates[0].date.toString('dd/MM/yyyy'),
                type: 'Show',
                desc:S(e.description).stripTags().s
            })
        });

先行入力にも JSON として送信します。

$('#header-search').typeahead({
    remote: '/layoutSearch?value=%QUERY',
    template:
        '<table style="width: 400px;"><tr><td><strong>{{name}}</strong></td><td style="float: right">{{date}} - <em>{{type}}</em></td></tr></table>' +
        '<p style="line-height: 100%; font-size: 11px">{{desc}}</p>'
    ,
    engine: Hogan,
    onselect: function(obj) {
        console.log('Selected: ' + obj);
    }
});

私の「ヘッダー検索」コード（ジェイド）：

input#header-search.typeahead(type='text', placeholder='Search...', data-provide='typeahead', data-items='4')

どこかで「data-items」を見つけて追加しましたが、何も変更されておらず、「data-provide」でも、名前フィールドが先行入力オプションで指定されています。私のクエリは問題ありません。既存のドキュメントを正確に返します。

どんな提案でも大歓迎です。

4

2 に答える 2

6

これが必要だと思います：

valueKey – The key used to access the value of the datum in the datum object. Defaults to value.

だからこれを試してください：

$('#header-search').typeahead({
    remote: '/layoutSearch?value=%QUERY',
    valueKey: 'name',
    template:
        '<table style="width: 400px;"><tr><td><strong>{{name}}</strong></td><td style="float: right">{{date}} - <em>{{type}}</em></td></tr></table>' +
        '<p style="line-height: 100%; font-size: 11px">{{desc}}</p>'
    ,
    engine: Hogan,
    onselect: function(obj) {
        console.log('Selected: ' + obj);
    }
});

それが役に立てば幸い！

于 2013-08-03T10:39:32.573 に答える
0

エンジンとして使用している場合Bloodhound、追加しても問題は解決しないと思いますvalueKeyが、この解決策はうまくいくようです:

Typeahead.js / Bloodhound は結果を 1 つだけ表示します

これは私にとってはうまくいきました。

于 2016-02-14T16:12:09.900 に答える