backbone.js - ハンドルバー - DOM を再レンダリングせずにテンプレートを更新する

Question

ここに興味深い問題があります。このようなテンプレートがあります。

<script id="temp" type="text/x-handlebars-template">
    <div class="entry">
        <label>Label 1  <input type="text" value="{{val1}}"/></label>
    </div>
    <div class="entry">
        <label>Label 2  <input type="text" value="{{val2}}"/></label>
    </div>
    <div class="entry">
        <label>Label 3  <input type="text" value="{{val3}}"/></label>
    </div>
    <div class="entry">
        <label>Label 4  <input type="text" value="{{val4}}"/></label>
    </div>
    <div class="entry">
        <label>Label 5  <input type="text" value="{{val5}}"/></label>
    </div>
    <div class="entry">
        <label>Label 6  <input type="text" value="{{val6}}"/></label>
    </div>
    ....
    .... </script>

私のテンプレートはかなり大きいです。上に示したように、多くの入力があり、テンプレートにほぼ 10 個のブートストラップ datetimepickerを含めました。初めてこのようにコンパイルして dom を追加しても問題ありません。

var t = Handlebars.compile($('#temp').html());
$('body').append(t(values);

しかし、入力と日時ピッカーの値のみを更新する必要がある場合に、このテンプレート全体を再レンダリングするのは良くありません。したがって、値を単独で更新する必要がある以下のようなことをする必要があります。

t(値変更);
または
t('refresh', valueChanged);

これを行う方法はありますか？このjsFiddleが役立つ場合があります。