jamesflorentino/app.js

## app.js
App = Ember.Application.create();

App.Router.map(function() {
    this.route('post', { path: '/:post_id' });
});

posts = [{
    id: 0,
    title: "Rails is omakase",
    body: "There are lots of à la carte software environments in this world."
}, {
    id: 1,
    title: "Broken Promises",
    body: "James Coglan wrote a lengthy article about Promises in node.js."
}];

App.IndexRoute = Ember.Route.extend({
    model: function() {
        return posts;
    }
});

## index.html
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/handlebars.js/1.0.0/handlebars.js"></script>
<script src="http://builds.emberjs.com/ember-latest.js"></script>
<script src="app.js"></script>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
    <script type="text/x-handlebars" id="application">
        {{outlet}}
    </script>

    <script type="text/x-handlebars" id="index">
        <ul>
        {{#each}}
        <li>{{#link-to "post" this}}{{title}}{{/link-to}}</li>
        {{/each}}
        </ul>
    </script>

    <script type="text/x-handlebars" id="post">
        {{blog-post title=title body=body}}
    </script>

    <script type="text/x-handlebars" data-template-name="components/blog-post">
        <h1>{{title}}</h1>
        <p>{{body}}</p>
    </script>
</body>
</html>
	App = Ember.Application.create();

	App.Router.map(function() {
	this.route('post', { path: '/:post_id' });
	});

	posts = [{
	id: 0,
	title: "Rails is omakase",
	body: "There are lots of à la carte software environments in this world."
	}, {
	id: 1,
	title: "Broken Promises",
	body: "James Coglan wrote a lengthy article about Promises in node.js."
	}];

	App.IndexRoute = Ember.Route.extend({
	model: function() {
	return posts;
	}
	});
	<!DOCTYPE html>
	<html>
	<head>
	<script src="http://code.jquery.com/jquery.js"></script>
	<script src="//cdnjs.cloudflare.com/ajax/libs/handlebars.js/1.0.0/handlebars.js"></script>
	<script src="http://builds.emberjs.com/ember-latest.js"></script>
	<script src="app.js"></script>
	<meta charset=utf-8 />
	<title>JS Bin</title>
	</head>
	<body>
	<script type="text/x-handlebars" id="application">
	{{outlet}}
	</script>

	<script type="text/x-handlebars" id="index">
	<ul>
	{{#each}}
	<li>{{#link-to "post" this}}{{title}}{{/link-to}}</li>
	{{/each}}
	</ul>
	</script>

	<script type="text/x-handlebars" id="post">
	{{blog-post title=title body=body}}
	</script>

	<script type="text/x-handlebars" data-template-name="components/blog-post">
	<h1>{{title}}</h1>
	<p>{{body}}</p>
	</script>
	</body>
	</html>