DEV Community

Lam
Lam

Posted on

2 2

Ember.Js Cheat Sheet

markup

    <img {{bindAttr src="avatarURL"}}>
    <button {{action follow}}>
Enter fullscreen mode Exit fullscreen mode

Value binding:

    {{view Ember.TextField class="input block" valuebinding="emailAddresses"}}
Enter fullscreen mode Exit fullscreen mode

Actions:

    <button {{action invite emailAddresses}}>Invite></button>
    <a href="#" {{action set "isEditingContacts" true target="view"}} 
Enter fullscreen mode Exit fullscreen mode

View

    App.InfoView = Ember.View.extend({
      templateName: 'input',  /* optional */

      fooName: "Hello"  /* {{ view.fooName }} */

      click: function(e) {
        "I was clicked";
      }

    });
Enter fullscreen mode Exit fullscreen mode

A route

    App.IndexRoute = Ember.Route.extend({
      setupController: function(controller) {
        controller.set('title', 'my app');
        // <h1>{{title}}</h1>
      },

      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);
      },

      serialize: function(model) {
        // this will make the URL `/posts/foo-post`
        return { post_slug: model.get('slug') };
      }
    });
Enter fullscreen mode Exit fullscreen mode

Routes

    App.Router.map(function() {
      this.resource('trips', function() {
          this.route('item', { path: '/:trip_id' });
      });

      this.route('upcoming');
      this.route('about', { path: '/about' });
      this.route('schedules');
      this.route('history');
      this.route('post');
    });
Enter fullscreen mode Exit fullscreen mode

Reference

Postmark Image

Speedy emails, satisfied customers

Are delayed transactional emails costing you user satisfaction? Postmark delivers your emails almost instantly, keeping your customers happy and connected.

Sign up

Top comments (0)

Sentry image

See why 4M developers consider Sentry, “not bad.”

Fixing code doesn’t have to be the worst part of your day. Learn how Sentry can help.

Learn more

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay