Typeahead模板，if / else [英] Typeahead templating, if/else

问题描述

感谢您对此问题的帮助：预先输出结果格式，这是一个跟进。

thanks for the help on this question: Typeahead result formatting, this is a follow up.

我的JSON看起来像

[{name =Long Island，type = 2，id =1234}，{name =New York，type =1，id =5678}]

在下拉列表中，我需要能够从类型2中分离类型1，所以

In the drop down list I need to be able to seperate type 1 from type 2, so

类型1标题​​

类型1商品

类型1商品*

类型2标题

类型2商品

类型2商品

如果类型1没有结果，则不显示标题。对于类型2也是如此。

If there are no results for type 1, then don't show the heading. Same for type 2.

这是否可以使用typeahead和模板引擎？我正在使用Hogan，但我并不挑剔。

Is this possible with typeahead and a templating engine? I'm using Hogan but I'm not fussy.

推荐答案

Typeahead这样做的方法是分离你的数据集分为2个数据集，一个只返回类型1项，另一个只返回类型2项。在typeahead中，每个数据集都可以有自己的标题，它的行为与你想要的完全一样。

The "Typeahead" way of doing this is to separate your dataset into 2 datasets, one that will only return "type 1" items and another that will return only "type 2" items. In typeahead, each dataset can have its own header, which will behave exactly the way you want it.

$autocomplete.typeahead([{
    name: 'location 1',
    remote: {
        url: 'http://pathtomysite.com/%QUERY?type=1',
        dataType: 'jsonp',
        valueKey: 'name'
        filter: function (parsedResponse) { return parsedResponse.locations; }
    },
    template: [
        '<p class="repo-name">{{name}}</p>',
        '<p class="repo-description">{{id}}</p>'
    ].join(''),
    header: '<b>Type 1</b>'
    engine: Hogan
}, {
    name: 'location 2',
    remote: {
        url: 'http://pathtomysite.com/%QUERY??type=2',
        dataType: 'jsonp',
        valueKey: 'name'
        filter: function (parsedResponse) { return parsedResponse.locations; }
    },
    template: [
        '<p class="repo-name">{{name}}</p>',
        '<p class="repo-description">{{id}}</p>'
    ].join(''),
    header: '<b>Type 2</b>'
    engine: Hogan
}])

这篇关于Typeahead模板，if / else的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！