ember.js - How to instantiate the Ember Application when using precompiled templates with grunt-ember-templates -
(this questions related this one, have moved grunt-ember-templates instead of grunt-contrib-handlebars)
i trying split ember.js handlebars templates in several files, in order make code base more manageable. using grunt-ember-templates, configured follows:
ember_templates: { compile: { options: { templatename: function(sourcefile) { return sourcefile.replace(/app\/templates\//, ''); // <%= yeoman.dist %>/scripts/ } }, files: { '<%= yeoman.dist %>/scripts/templates.js': [ '<%= yeoman.app %>/templates/**/*.hbs' ] } } } this creates dist/scripts/templates.js expected, client happily loading. templates.js looks this:
ember.templates["accounts"] = ember.handlebars.template(function anonymous(handlebars,depth0,helpers,partials,data) { ... this looks fine me: templates saved in ember.templates array, expected keys. there application key, further down generated templates.js file:
ember.templates["application"] = ember.handlebars.template(function anonymous(handlebars,depth0,helpers,partials,data) { which coming templates/application.hbs:
<section class="toolbar"> </section> <section class="main_section"> <nav> ... </nav> {{ outlet }} </section> <div class="modal small hide fade" id="mymodal" tabindex="-1" role="dialog" aria-labelledby="mymodallabel" aria-hidden="true"> <div class="modal-header"> ... </div> still, getting error when templates.js loaded (which embedded inside scripts.js, see below index.html):
uncaught error: assertion failed: specified templatename application <app.applicationview:ember312>, did not exist. what criptical error mean , how can rid of it?
this ember application:
this.app = ember.application.create({ log_transitions: true, version: '1.0.0', ready: function () { console.log('app version: ' + app.version + ' ready.'); } }); this applicationview:
app.applicationview = ember.view.extend({ templatename: 'application' }); this index.html:
<!doctype html> <!--[if lt ie 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]--> <!--[if ie 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]--> <!--[if ie 8]> <html class="no-js lt-ie9"> <![endif]--> <!--[if gt ie 8]><!--> <html class="no-js"> <!--<![endif]--> <head> <meta charset="utf-8"/> <meta http-equiv="x-ua-compatible" content="ie=edge,chrome=1"/> <title></title> <meta name="description" content=""/> <meta name="viewport" content="width=device-width"/> <!-- build:css styles/main.css --> <link rel="stylesheet" href="styles/bootstrap.min.css"/> <link rel="stylesheet" href="styles/css/font-awesome.min.css"/> <link rel="stylesheet" href="styles/font-styles.css"/> <link rel="stylesheet" href="styles/main.css"/> <!-- endbuild --> </head> <body> <!--[if lt ie 7]> <p class="chromeframe">you using outdated browser. <a href="http://browsehappy.com/">upgrade browser today</a> or <a href="http://www.google.com/chromeframe/?redirect=true">install google chrome frame</a> better experience site.</p> <![endif]--> <!-- add site or application content here --> <!-- templates used here, in templates.js --> <div class="pagination"> <ul> <li><a href="#">prev</a></li> <li><a href="#">1</a></li> <li><a href="#">2</a></li> <li><a href="#">3</a></li> <li><a href="#">4</a></li> <li><a href="#">next</a></li> </ul> </div> </script> <!-- build:js scripts/scripts.js --> <script src="scripts/vendor/jquery-1.9.1.js"></script> <script src="scripts/vendor/handlebars.1.0.rc.3.js"></script> <script src="scripts/vendor/ember-1.0.0-rc.2.js"></script> <script src="scripts/vendor/ember-data.js"></script> <script src="scripts/vendor/bootstrap.min.js"></script> <script src="scripts/templates.js"></script> <script src="scripts/main.js"></script> <!-- endbuild --> </body> </html>
for record: problem solved changing order in javascript files loaded.
the templates.js must loaded after ember loaded.
i thought ember needs templates defined before loading, wrong: since templates stored in ember.templates, ember must loaded before templates are. templates can loaded, , application can created.
the reason why did not find bug before ember not complaining @ in console.
Comments
Post a Comment