2

下面的代码在 Chrome 的 JavaScript 控制台中给了我这个错误：

未捕获的类型错误：未定义不是函数

堆栈跟踪：

(anonymous function) ember-1.0.0-rc.3.js:22443
b.extend.each jquery-1.9.1.min.js:3
b.fn.b.each jquery-1.9.1.min.js:3
Ember.Handlebars.bootstrap ember-1.0.0-rc.3.js:22432
bootstrap ember-1.0.0-rc.3.js:22454
(anonymous function) ember-1.0.0-rc.3.js:12646
Ember.runLoadHooks ember-1.0.0-rc.3.js:12645
Ember.Application.Ember.Namespace.extend._initialize ember-1.0.0-rc.3.js:26808
(anonymous function) ember-1.0.0-rc.3.js:4504
Ember.handleErrors ember-1.0.0-rc.3.js:411
invoke ember-1.0.0-rc.3.js:4502
iter ember-1.0.0-rc.3.js:4572
RunLoop.flush ember-1.0.0-rc.3.js:4626
RunLoop.end ember-1.0.0-rc.3.js:4531
tryable ember-1.0.0-rc.3.js:4732
Ember.tryFinally ember-1.0.0-rc.3.js:1199
Ember.run.end ember-1.0.0-rc.3.js:4735
autorun

使用 Ember 的 dev 版本，在引导过程中会出现这个错误：

Ember.Handlebars.bootstrap = function(ctx) {
  var selectors = 'script[type="text/x-handlebars"], script[type="text/x-raw-handlebars"]';

  Ember.$(selectors, ctx)
    .each(function() {
    // Get a reference to the script tag
    var script = Ember.$(this);

    var compile = (script.attr('type') === 'text/x-raw-handlebars') ?
                  Ember.$.proxy(Handlebars.compile, Handlebars) :
                  Ember.$.proxy(Ember.Handlebars.compile, Ember.Handlebars),
      // Get the name of the script, used by Ember.View's templateName property.
      // First look for data-template-name attribute, then fall back to its
      // id if no name is found.
      templateName = script.attr('data-template-name') || script.attr('id') || 'application',

      /**** ERROR HERE ****/
      template = compile(script.html());

我的 HTML 代码（JS 是取自 Ember 主页的示例代码）：

<!doctype html>
<html>
    <head>
        <title></title>
    </head>

    <body>

        <div id="mapTemplate">
            <canvas style="border: thick solid black" id="mapDesigner" width="500" height="500"></canvas>
        </div>

        <script src="3rdParty/jQuery/jquery-1.9.1.min.js"></script>
        <script src="3rdParty/HandlebarsJS/handlebars.runtime.js"></script>
        <script src="3rdParty/EmberJS/ember-1.0.0-rc.3.min.js"></script>

        <script type="text/x-handlebars">
            {{outlet}}
        </script>

        <script type="text/x-handlebars" id="index">
            <h1>People</h1>

            <ul>
            {{#each model}}
                <li>Hello, <b>{{fullName}}</b>!</li>
            {{/each}}
            </ul>
        </script>
        <script>
            $(function () {
                App = Ember.Application.create();

                App.Person = Ember.Object.extend({
                    firstName: null,
                    lastName: null,

                    fullName: function() {
                        return this.get('firstName') +
                                    " " + this.get('lastName');
                    }.property('firstName', 'lastName')
                });

                App.IndexRoute = Ember.Route.extend({
                    model: function() {
                        var people = [
                            App.Person.create({
                                firstName: "Tom",
                                lastName: "Dale"
                            }),
                            App.Person.create({
                                firstName: "Yehuda",
                                lastName: "Katz"
                            })
                        ];
                        return people;
                    }
                });

            });
        </script>

    </body>
</html>

库版本：

Handlebars.js：1.0.0-rc.3
Ember.js：1.0.0-rc.3
jQuery：1.9.1

jsFiddle 游乐场

http://jsfiddle.net/t7qbe/1/

4

4 回答 4

3

我今天在迁移旧的 ember 应用程序时遇到了这个问题。该问题是由混合类型的模板x-handlebars和x-raw-handlebars.

如果您在生产环境中编译模板，那么您的构建系统可能只是捆绑handlebars.runtime.js了把手的一个子集，而无法编译模板。这很好，因为您的模板已经编译为 javascript。

但是，如果您x-handlebars在 html 中添加一些脚本标签，Ember 将作为其引导过程的一部分来预编译这些模板。但是如果没有完整的车把库，它将在compile功能上失败。

解决方案：如果您需要在仍然使用已编译模板的同时编译把手，请确保您的构建系统包含完整的把手库，而不仅仅是运行时。

于 2014-06-22T05:34:13.950 回答
2

您使用的 ember 和车把版本可能已关闭？不确定 Handlebars 运行时是什么。我用builds.emberjs.com中的正确版本替换了它们，现在它可以工作了。

于 2013-05-10T18:23:12.907 回答
1

2014 年更新 -

当我切换到 cloudflare 时遇到了同样的错误。这是一个真正的糟糕追踪。希望有更好的信息。

正在使用：

<script src="http://cdnjs.cloudflare.com/ajax/libs/handlebars.js/1.1.2/handlebars.runtime.min.js"></script>

换成：

<script src="http://cdnjs.cloudflare.com/ajax/libs/handlebars.js/1.1.2/handlebars.min.js"></script>

错误消失了。

于 2014-03-21T21:18:50.530 回答
0

我怀疑缩小是问题所在。Handlebars 的运行时版本仅适用于预编译模板。在这种情况下，Ember 无论如何都会尝试编译您的内联模板。更多来自 Handlebars 网站：http ://handlebarsjs.com/precompilation.html

这是您的 JsFiddle的工作版本.runtime，我在其中将Handlebars 换成了完整版本。

于 2013-05-29T05:59:34.680 回答