【问题标题】：mixed normal page css with ember handlebar css将普通页面 css 与 ember 车把 css 混合
【发布时间】：2026-01-23 17:25:01
【问题描述】：

html.erb 模板：

<div class="container">    
  <script type="text/x-handlebars" id="sentence">content</script>
</div>

但检查了萤火虫，它变成了

<div class="container"></div>

<div id="ember299" class="ember-view">
  blablabla.....
</div>

所以，问题是脚本不包含在容器属性中

【问题讨论】：

你打电话给Handlebars.compile(source); - handlebarsjs.com
你的容器 div 不应该进入视图的父模板吗？还是应用程序模板（如果它包含所有内容）？

标签： css ruby-on-rails twitter-bootstrap view ember.js

【解决方案1】：

<body>
  <script type="text/x-handlebars">
    <div class="container">
      {{outlet}}
    </div>
  </script>

  <script type="text/x-handlebars" id="sentence">
    content
  </script>
</body>

没有id的模板是应用模板。

【讨论】：

不要对所有页面都使用把手
@Daniel，我不确定这是否可能。应用程序模板附加到应用程序容器（默认为主体），而不是内联呈现。

【解决方案2】：

application.html.erb

<div class="container" style="margin-top: 28px;">
    <%= yield %>
  </div>

index.html.erb

<script type="text/x-handlebars" id="sentence">content</script>

然后检查firebug，就变成了

<div class="container"></div>

<div id="ember299" class="ember-view">
  blablabla.....
</div>

使用产量，而不是 {{outlet}}

【讨论】：

html.erb 模板：

但检查了萤火虫，它变成了

application.html.erb

index.html.erb

然后检查firebug，就变成了

使用产量 ，而不是 {{outlet}}

使用产量，而不是 {{outlet}}