diff --git a/ember.md b/ember.md
index e43677786..f8d077fbc 100644
--- a/ember.md
+++ b/ember.md
@@ -7,68 +7,65 @@ category: JavaScript libraries
### Routes
- App.Router.map(function() {
- this.resource('trips', function() {
- this.route('item', { path: '/:trip_id' });
+ Router.map(function() {
+ this.route('trips', function() {
+ this.route('item', { path: '/:tripId' });
});
this.route('upcoming');
- this.route('about', { path: '/about' });
+ this.route('about', { path: '/aboutus' });
this.route('schedules');
this.route('history');
- this.route('post');
+ this.route('post', { path: '/post/:postId' });
});
### A route
- App.IndexRoute = Ember.Route.extend({
- setupController: function(controller) {
- controller.set('title', 'my app');
- //
{{title}}
- },
+ import Route from '@ember/routing/route';
+
+ export default PostRoute extends Route {
+ model({ postId }) {
+ // Post will be accessible as `this.model` in the controller
+ // or `{{@model}}` in the template.
+ return this.store.find('post', postId);
+ }
+ }
- setupController: function(controller, model) {
- controller.set("model", model);
- this.controllerFor('topPost').set('model', model);
- },
-
- model: function(params) {
- return this.store.find('posts');
- return this.store.find('post', params.post_id);
- },
+### Component
+
+ import Component from '@glimmer/component';
+ import { tracked } from '@glimmer/tracking';
+
+ export default PostEditor extends Component {
+ @tracked title;
+
+ get fullTitle() {
+ return `Post: ${title}`;
+ }
- serialize: function(model) {
- // this will make the URL `/posts/foo-post`
- return { post_slug: model.get('slug') };
+ titleUpdate(event) {
+ this.title = event.target.value;
}
- });
+ }
-### View
+### Template
- App.InfoView = Ember.View.extend({
- templateName: 'input', /* optional */
+
+
+
- fooName: "Hello" /* {{ view.fooName }} */
+
+ {{this.fullTitle}}
+
+
- click: function(e) {
- "I was clicked";
- }
+Invoking the component:
- });
+
-### markup
-
-
-