0

typeahead.jsを使用すると、エンジンがこの API を実装している限り、選択したエンジンを使用してオートコンプリート候補のテンプレートをレンダリングできます。

// engine has a compile function that returns a compiled template
var compiledTemplate = ENGINE.compile(template);

// compiled template has a render function that returns the rendered template
// render function expects the context to be first argument passed to it
var html = compiledTemplate.render(context);

現在、 dust.jsはこの問題について少し異なる見方をしています。

var compiled = dust.compile("Hello {name}!", "intro");
dust.loadSource(compiled);

Dust.js は既に統合されているので、typeahead の提案もレンダリングするために使用したいと思います。おそらくダストのエンジン オブジェクトをラップして、必要な API を提供できますが、必要な関数をダスト オブジェクト自体に動的にアタッチするなど、これを行うためのより控えめでエレガントな方法があるかどうか疑問に思っています。

追加するために編集: @ user2103008 と @ Simon が持っているものを混合すると、typeahead-0.9.3 で使用しているものを次に示します。

function typeaheadFakeCompile(dustTemplateName) {
    return function(data) {
        var html;
        dust.render(dustTemplateName, data, function(err, out) { html = out; })
        return html;
    }
}

var compiled = dust.compile('Hello {name}!', 'myTemplate');
dust.loadSource(compiled);

$('selector').typeahead({
   template: typeaheadFakeCompile('myTemplate')
)};
4

1 に答える 1

0

typeahead プラグインに渡されるtemplateパラメーターは、コンパイル済みのテンプレートまたは文字列のいずれかです。文字列の場合、先行入力プラグインはそれをコンパイルしようとします。ほこりでこれをしないでください。代わりに、通常のようにダスト テンプレートをコンパイルしますが、テンプレート パラメータを次のように渡します。

var compiled = dust.compile('Hello {name}!', 'myTemplate');
dust.loadSource(compiled);

$('selector').typeahead({
    template: fakeCompile('myTemplate')
)};

function fakeCompile (dustTemplateName) {
    return {
        render: function (data) {
            var html;
            dust.render(dustTemplateName, data, function (err,out) { html = out });
            return html;
        }
    }
}

Typeahead は、別のコンパイルを試みることなく、「コンパイル済み」のテンプレートをそのまま使用する必要があります。

EDIT @ user2103008 のおかげで、ダスト レンダリング コールバック関数のシグネチャが修正されました。

于 2013-10-11T09:51:37.063 に答える