1

我正在尝试通过烧瓶应用程序定义 typeahead.js 的模板。

我正在寻找的解决方案是覆盖默认(jinja2)模板,或者使用默认值来定义新模板。

更新:

这就是我到目前为止所拥有的。“价值”以外的任何其他价值都不起作用。

$('#search').typeahead({
    name: 'Search',
    local: {
        value: 'String1',
        tokens: ['1','one'],
        name: 'StringTest'
    },
    template: '<p>Template {{value}}{{name}}</p>', // Only shows "Template String1"
    engine: Hogan
});

这是我的模板的样子

<script src='http://twitter.github.com/typeahead.js/releases/latest/typeahead.js'</script>   
<script src="http://twitter.github.com/hogan.js/builds/2.0.0/hogan-2.0.0.js"></script>
<script src="static/js/search.js"></script> // Hard coded to see if it works.. 
4

2 回答 2

1

我看到有几种方法可以实现你想要的。最简单的方法是将 typeahead.js 代码分离到另一个文件中。

因此,在您的主模板中,您可以拥有:

<script src="/js/typeahead.js" type="text/javascript"></script>
<script type="text/javascript">
    var prefetch_url = '{{ url_for('jsonData') }}'; // not so sure if you need the quote here?
</script>
<script src="/js/main.js" type="text/javascript"></script>

... your template code ...

main.js文件中,您可以像往常一样初始化 typeahead.js:

$('#search').typeahead.js({
    name: 'Search',
    prefetch: prefetch_url,
    template: ... ,// a normal Hogan template
    engine: Hogan
});

由于 Flask 不处理静态文件main.js,所以 Jinja2 不会与 Hogan 语法冲突,你可以在那里做任何你想做的事情。

希望能帮助到你。

于 2013-08-21T09:08:27.890 回答
0

您可以使用{% raw %}Jinja 模板标签来转义Jinja2 文档{{}}中提到的:

$('#search').typeahead({
    name: 'Search',
    local: {
        value: 'String1',
        tokens: ['1','one'],
        name: 'StringTest'
    },
    template: {% raw %}'<p>Template {{value}}{{name}}</p>'{% endraw %},
    engine: Hogan
});
于 2015-12-09T14:26:29.190 回答