javascript - Ember.js: "Undefined is not a function" in internal bootstrapping process -
the code below gives me error in chrome's javascript console:
uncaught typeerror: undefined not function
stack trace:
(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 using ember's dev version, error occurs in bootstrapping process:
ember.handlebars.bootstrap = function(ctx) { var selectors = 'script[type="text/x-handlebars"], script[type="text/x-raw-handlebars"]'; ember.$(selectors, ctx) .each(function() { // reference 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), // name of script, used ember.view's templatename property. // first data-template-name attribute, fall // id if no name found. templatename = script.attr('data-template-name') || script.attr('id') || 'application', /**** error here ****/ template = compile(script.html()); my html code (the js sample code taken ember's homepage):
<!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> library versions:
handlebars.js: 1.0.0-rc.3
ember.js: 1.0.0-rc.3
jquery: 1.9.1
jsfiddle playground
the versions of ember , handlebars using off maybe? not sure handlebars runtime is. replaced them correct versions builds.emberjs.com , works.
Comments
Post a Comment