javascriptで大規模なHTMLブロックをレールに追加するクリーナーの方法

Question

私は角度の付いたレールアプリを持っており、テキストエリアのタグのデフォルトテキストを埋めることができるようにHTMLの大きなブロックを埋める必要があります。現在、私がやったことは、私はそれを行うためのクリーンな方法があるかどうかを知りたいと思い、この

"<div class='navbar navbar-default letter-header hidden-sm hidden-xs'>\n" + 
    " <div class='container'>\n" + 
    " <div class='letter-navbar-header navbar-header'>\n" + 
    "  <a href='/'><img src='/assets/logo.png' class='letters-logo navbar-brand'></a>\n" + 
    " </div>\n" + 

    " <div class='navbar-header header-text'>\n" + 
    "  <div class='navbar-text'>\n" + 
    "  "text" + "\n" + 
    "  </div>\n" + 
    " </div>\n" + 
    " <div class='letter-navbar-header navbar-header'>\n" + 
    "  <a href='/'>\n" + 
    "  <img src='' class='second-logo'>\n" + 
    "  </a>\n" + 
    " </div>\n" + 
    " <div class='navbar-header navbar-right'>\n" + 
    "  {{ user_login }}" + "\n" + 
    " </div>\n" + 
    " </div>\n" + 
    "</div>\n" 

のようにテキストを追加しました。私はこの

<%= j render('navbar') %> 

ようにレンダリング機能付きjs.erbファイルを使用してみましたが、レンダリング機能がhttps://stackoverflow.com/a/8370847/1087841が動作していないので、資産フォルダに置かれています。私はそれを行うより良い方法があるかどうかを知りたいと思います。

[編集] js.erbファイルは、実際には角型ファクトリで、ナビゲーションバー用のデフォルトのHTMLがあり、デフォルトのデータをレンダリングするために角度コントローラによって使用されます。また、factoryファイルもrequireとしてapplication.jsに追加されます。 これは、私はデフォルトのHTMLで値タグを配置している可能性がありますが、それはng-modelので、何も表示されません取得したデフォルトのhtml

<textarea name="t[navigation]" id="input-navigation-bar" ng-model="t.navigation_bar" class="form-control" rows="10"></textarea> 

を必要とテキストエリアです。そこで、デフォルトデータ用のファクトリを作成しました。今度は/ assetsに入っていて、application.jsには//= require 'default_html_factory'というファクトリがあります。

Answer 1

私は最終的にそれを行う方法を見つけました。 ERBのページでは、私は

<script> 
    <%= render 'style_factory.js.erb' %> 
</script> 

を追加し、工場で私はこの

this.ngapp.factory('TenantStyle', function() { 
    return { 
    header: "<%= j render 'navbar' %>" 
    } 
}); 

を追加し、_navbar.html.erbファイルで、私はこの

<div class="navbar navbar-default letter-header hidden-sm hidden-xs"> 
    <div class="container"> 
    <div class="letter-navbar-header navbar-header"> 
    </div> 

    <div class="navbar-header header-text"> 
     <div class="navbar-text"> 
     </div> 
    </div> 
    <div class='letter-navbar-header navbar-header'> 
     <a href='/'> 
     <img src='' class='second-logo'> 
     </a> 
    </div> 

    <div class="navbar-header navbar-right"> 
    </div> 
    </div> 
</div> 

を追加し、今私ができますファクトリを角度で呼び出してヘッダ値を取得します。