railsで利用しているHTMLテンプレートをJSで利用したい

[code]

    - users.each do |user|
      .list
        .elem
          h2 = user.name
          time = user.created_at
          p = user.comment
    
[/code]

上記のようなテンプレート（slim）が以下のようなHTMLを出力します。  

[code]

      <div class="elem">
        <h2>Nagashima Koji</h2>
        <time>2014/02/23 17:14</time>
        <p>こんにちわ</p>
      </div>
    
      <div class="elem">
        <h2>Toyama Ippei</h2>
        <time>2014/02/23 17:16</time>
        <p>よろしく</p>
      </div>
    
    </div>
    
[/code]

現在リストには2つの要素が存在しますが、このリストの下にすぐフォームが設置してあり、そのフォームからJavascriptで動的に要素を追加できるようにした場合、slimのテンプレートをjsで使いまわすといったことはできるのでしょうか。

できなかった場合、jsに直接slimテンプレートと同じようなHTMLを記述する方法が考えられますが、少し気持ちが悪いので、もう少しマシな方法はありませんでしょうか。




knockout.jsを利用するという方法が、自分なりに良い解決策だと判断しました。




Nested Formというgemの実装が参考になるかもしれません。

<https://github.com/ryanb/nested_form>

Nested Formには、親モデルのフォーム上で子モデルの入力欄を動的に追加できる機能があります。

参考: <http://www.fairwaytech.com/wp-
content/uploads/2013/02/Nested_Form_Edit_Ship_w_Pilots.png>

![画像の説明をここに入力](https://i.stack.imgur.com/H14lx.png)

技術的な詳しい説明は長くなるので省略しますが、ざっくり言うと予めhidden要素としてフォームのテンプレートを隠しておき、JSのイベントでそのフォームをコピー＆表示、しています。

一度自分でNested Formを動かしてみて、そこから実装方法を検討してみると良いのではないでしょうか？

