0

現在の最新のjsRender（2013年12月2日現在）を使用しており、ネストされたオブジェクトモデルをレンダリングできるようにテンプレートをコンポーネント化しようとしています。

私はどちらかができるようになりたいです。

1.パラメータをテンプレート関数に渡して、さまざまなパラメータで再帰的に呼び出すことができるようにします。

    <script id="tmplQ" myParam="int?" type="text/x-jquery-tmpl">
        <div class="rgRow L{:*myParam*} e">  // wrap this in L2/L3/L4 etc depending on myParam
            <div class="td q">{{:q}}</div>
        </div>
        {{for cq templ="#tmlQ(myParam+1)"}}  // increment parameter for recursing
    <script>

したがって、基本的には、最初に0を指定してmyParamを渡し、次に、ネストされたjsonオブジェクトモデルをドリルダウンするときにテンプレートがそれ自体を呼び出します。

[更新] OK、それで、さらに数ページを検索すると、これを実行できるように見えます。JsRender：ネストされたテンプレートに変数を渡す方法ですが、可能な場合は、これらの他のオプションを引き続き確認したいと思います。[/アップデート]

2.またはそれが失敗した場合、私は単にブロックテンプレートの一部を別のインラインテンプレートに含めようとしました。

    {{for cq tmpl="#tmplQ"}}         // renders inline template but nothing else
          <div class="rgRow L2 e">         // needed to wrap this in L2
          {{for cq tmpl="#tmplQ"}}     // can't mix inline/block templates
              <div class="rgRow L3 e"> // wanted to wrap this in L3
                  {{for cq tmpl="#tmplQ"/}}  // would work if it got here
              </div>
          {{/for}}
        </div>
    {{/for}}

よりシンプルなライブラリテンプレートを使用します。

<script id="tmplQ" type="text/x-jquery-tmpl">
    <div class="td q">{{:q}}</div>
</script>

問題は、jsRenderがインラインスタイルとブロックスタイルの両方の混合をサポートしていないように見えることです。あなたがそれを入れるとすぐtmpl=に、{{for}}それはその下にネストされた他のすべてを無視します。それは残念です。私はそれが2つの混合物をサポートすることを望んでいます。エラーもスローしません。

また、テンプレートをインラインで呼び出すために、このような構文を見つけようとしました。それは存在しますか？

    {{for cq tmpl="#tmplQ"}}         // renders inline template but nothing else
          <div class="rgRow L2 e">   // wrap in L2
          {{for cq}}
              {{call tmpl="#tmplQ"}}         // call library template????
              <span>other content</span>
          {{/for}}
        </div>
    {{/for}}

しかし、それも機能しません。テンプレートを直接呼び出すためにも、これらを試しました。

{{tmplQ()}}
{{tmpl("#tmplQ")}}

誰かが手がかりを得ました、または（ボリス）何かが次の改訂への道を作るかもしれませんか？

4

2 に答える 2

1

最新のJsRenderアップデートでは、テンプレートとブロックコンテンツの両方を提供するための新しい「ラップされたテンプレート」機能が追加され、テンプレートがコンテンツを「ラップ」できるようになりました。例については、 http：//borismoore.github.com/jsrender/demos/step-by-step/06_template-composition.htmlを参照してください 。

于 2013-02-27T17:56:04.580 に答える
0

そこで、再帰テンプレートを使用して質問の最初の部分を解決した方法を次に示します。これは、渡されたパラメーターに基づいて L1、L2、L3 などを設定します。

<script id="tmplQ" type="text/x-jquery-tmpl">
    <div class="selected stmQ">
        {{for process.qs[0]}}
            {{for cq}}
                <a id="q-{{:stm.n}}">q-{{:stm.n}}</a>
                <div class="table">
                    {{for cq ~depth=1 tmpl="#tmplNestedQ"/}}
                </div>
            {{/for}}
        {{/for}}
    </div>
</script>

<script id="tmplNestedQ" type="text/x-jquery-tmpl">
    <div class="rgRow L{{:~depth}} e">
        <div class="td q">{{:q}}</div>
    </div>
    {{for cq ~depth=(~depth+1) tmpl="#tmplNestedQ"/}}
</script>
于 2013-02-12T22:52:02.473 に答える