Ember.js Cookbook

Using development helpers

Debugging your template is a task that you'll often use. Here are the steps to do this.

How to do it...

The most basic way of debugging Ember templates is to use {{log}} and {{debugger}}.

1. Create a new Ember application. Create a new component called log-example. Run this command in the root application folder:

   $ ember g component log-example
   

   This will create a new component template and JavaScript files.

2. Open the log-example.js file in the app/components folder and a new property called helloText:

   // app/components/log-example.js
   import Ember from 'ember';
   
   export default Ember.Component.extend({
       helloText: 'Hello World'
   });

   This is a simple component with just one property.

3. Open the log-example.hbs file in the app/templates/components ...