2

原谅我,因为我是 Ember 的新手(以及整个 Javascript 世界)。我有一个使用ember-railsgem 创建的 rails 应用程序,我们称之为“warthog”

我的application.js文件如下:

//= require jquery
//= require jquery_ujs
//= require handlebars
//= require ember
//= require ember-data
//= require_self
//= require warthog
Warthog = Ember.Application.create();
//= require bootstrap

接下来是application.html.haml文件

%html
  %head
    %title Warthog
    = stylesheet_link_tag    "application", :media => "all"
    = javascript_include_tag "application"
    = javascript_include_tag 'templates/application'

对于一些测试输出,我的application.handlebars文件中有一个字符串

This is a test

问题是javascripts/templates/application.handlebars没有被渲染。

这是请求完成后的页面源:

<html>
  <head>
    <title>Warthog</title>
    <link href="/assets/application.css?body=1" media="all" rel="stylesheet" type="text/css" />
    <script src="/assets/jquery.js?body=1" type="text/javascript"></script>
    <script src="/assets/jquery_ujs.js?body=1" type="text/javascript"></script>
    <script src="/assets/handlebars.js?body=1" type="text/javascript"></script>
    <script src="/assets/ember.js?body=1" type="text/javascript"></script>
    <script src="/assets/ember-data.js?body=1" type="text/javascript"></script>
    <script src="/assets/application.js?body=1" type="text/javascript"></script>
    <script src="/assets/store.js?body=1" type="text/javascript"></script>
    <script src="/assets/controllers/application_controller.js?body=1" type="text/javascript"></script>
    <script src="/assets/templates/application.js?body=1" type="text/javascript"></script>
    <script src="/assets/routes/application_routes.js?body=1" type="text/javascript"></script>
    <script src="/assets/router.js?body=1" type="text/javascript"></script>
    <script src="/assets/warthog.js?body=1" type="text/javascript"></script>
    <script src="/assets/templates/application.js?body=1" type="text/javascript"></script>
    <script src="//www.google.com/jsapi" type="text/javascript"></script>
    <script src="/assets/chartkick.js?body=1" type="text/javascript"></script>
    <meta content="authenticity_token" name="csrf-param" />
    <meta content="afE+P0e6I/KDeVpg/kLi8RvsPAAyYOwD6rE=" name="csrf-token" />
  </head>
  <body>
    <div id='container'>

    </div>
</body>
</html>

和控制台日志

DEBUG: ------------------------------- ember.js?body=1:394
DEBUG: Ember.VERSION : 1.0.0 ember.js?body=1:394
DEBUG: Handlebars.VERSION : 1.0.0 ember.js?body=1:394
DEBUG: jQuery.VERSION : 1.10.0 ember.js?body=1:394
DEBUG: ------------------------------- ember.js?body=1:394
Assertion failed: The view helper only takes a single argument ember.js?body=1:394
(anonymous function) ember.js?body=1:394
Ember.assert ember.js?body=1:53
(anonymous function) ember.js?body=1:25789
anonymous application.js?body=1:10
(anonymous function) handlebars.js?body=1:2214
Ember.View.Ember.CoreView.extend.render ember.js?body=1:20335
Ember.CoreView.Ember.Object.extend._renderToBuffer ember.js?body=1:19272
Ember.View.Ember.CoreView.extend._renderToBuffer ember.js?body=1:20915
superWrapper ember.js?body=1:1218
(anonymous function) ember.js?body=1:19253
Ember.Instrumentation.instrument ember.js?body=1:1662
Ember.CoreView.Ember.Object.extend.renderToBuffer ember.js?body=1:19252
Ember.View.Ember.CoreView.extend.createElement ember.js?body=1:20737
Ember.merge.insertElement ember.js?body=1:21686
Ember.View.Ember.CoreView.extend._insertElement ember.js?body=1:20665
DeferredActionQueues.flush ember.js?body=1:5459
Backburner.end ember.js?body=1:5545
Backburner.run ember.js?body=1:5584
Ember.run ember.js?body=1:5915
(anonymous function) ember.js?body=1:34656
fire jquery.js?body=1:3065
self.fireWith jquery.js?body=1:3177
jQuery.extend.ready jquery.js?body=1:434
completed jquery.js?body=1:105
Uncaught TypeError: Cannot read property '0' of undefined ember.js?body=1:25589
EmberHandlebars.ViewHelper.Ember.Object.create.helper ember.js?body=1:25589
(anonymous function) ember.js?body=1:25797
anonymous application.js?body=1:10
(anonymous function) handlebars.js?body=1:2214
Ember.View.Ember.CoreView.extend.render ember.js?body=1:20335
Ember.CoreView.Ember.Object.extend._renderToBuffer ember.js?body=1:19272
Ember.View.Ember.CoreView.extend._renderToBuffer ember.js?body=1:20915
superWrapper ember.js?body=1:1218
(anonymous function) ember.js?body=1:19253
Ember.Instrumentation.instrument ember.js?body=1:1662
Ember.CoreView.Ember.Object.extend.renderToBuffer ember.js?body=1:19252
Ember.View.Ember.CoreView.extend.createElement ember.js?body=1:20737
Ember.merge.insertElement ember.js?body=1:21686
Ember.View.Ember.CoreView.extend._insertElement ember.js?body=1:20665
DeferredActionQueues.flush ember.js?body=1:5459
Backburner.end ember.js?body=1:5545
Backburner.run ember.js?body=1:5584
Ember.run ember.js?body=1:5915
(anonymous function) ember.js?body=1:34656
fire jquery.js?body=1:3065
self.fireWith jquery.js?body=1:3177
jQuery.extend.ready jquery.js?body=1:434
completed jquery.js?body=1:105

解决方案:错误出现在我的控制器和 Ember 中的路由文件中;我删除了这些,现在页面呈现

4

1 回答 1

3

确保您的应用程序把手模板以这种格式注入

<script type="text/x-handlebars" data-template-name="application">

</script>

或者

<script type="text/x-handlebars" >

</script>

命名在 Ember 中非常重要,如果您的模板被注入了不同的名称,例如:

<script type="text/x-handlebars" data-template-name="templates/application">

</script>

然后,您需要一个应用程序视图,说明使用与默认模板名称不同的模板名称。

Warthog.ApplicationView = Ember.View.extend({
  templateName: 'templates/application'
})
于 2013-10-26T15:24:34.253 回答