Ember - 3. REST

February 17, 2015

Давно не брал я в руки вима, вот беру и снова беру. Недавно узнал, что есть устойчивая аббревиатура MEAN для стека из монго, експресса, ангуляра и ноды. У нас ембер вместо ангуляра, меняем ноду на iojs, работаем в стеке MEEIO.

В прошлом выпуске мы сделали буковку R из CRUD для постов, сегодня доделаем все остальные буквы. Обновляем рауты:

Router.map(function() {
  this.route('posts/index', {path: '/'});
  this.route('posts/new', {path: '/posts/new'});
  this.route('posts/show', {path: '/posts/:id'});
  this.route('posts/edit', {path: '/posts/:id/edit'});
});

На главной странице добавляем ссылку на создание нового поста (app/templates/posts/index.hbs):

<p>{{#link-to "posts/new"}}New Post{{/link-to}}</p>

Делаем раут для new (app/routes/posts/new.js):

export default Ember.Route.extend({
  model: function() {
    return this.store.createRecord('post');
  },

  deactivate: function() {
    if (this.controller.get("model.isNew")) {
      this.controller.get("model").rollback();
    }
  }
});

Обратите внимание на метод deactivate. Я не знаю насколько это стандартный прием, придумал его из головы. В прошлом выпуске мы обсуждали, что ембер-store - это некоторая сущность, которая должна синхронизироваться с сервером. createRecord не синхронизирует запись с сервером, однако создает его в сторе. И если вы откажитесь от сохранения записи и выйдите через меню на главную страницу, то пустая запись будет в вашем списке. Чтобы этого не произошло и добавил ролбек на не сохрненную модель.

В форме вешаем на кнопку экшен (app/templates/posts/_form.hbs):

  <button type="submit" class="btn btn-default" {{action "save"}}>Save</button>

Который обрабатываем в контроллере (app/controllers/posts/new.js):

import Ember from 'ember';

export default Ember.ObjectController.extend({
  actions: {
    save: function() {
      var me = this;
      var model = this.model;
      model.save().then(function() {
        me.transitionToRoute("posts/show", model);
      });
    }
  }
});

Таким образом реализовали C. Остальные буквы легко сделать по аналогии.

Поделиться
comments powered by Disqus