Ember.js - запрос на добавление записи имеет пустые параметры - PullRequest
Новая
       16

Ember.js - запрос на добавление записи имеет пустые параметры

0 голосов
/ 24 апреля 2019

Я использую ember-cli с бэкэндом Rails API и у меня возникают некоторые проблемы при добавлении новой записи.

Я настроил форму и маршрут и могу получить значения из формы,но save () не передает эти значения обратно в запрос POST для Rails, в результате чего создается пустая запись.

Буду признателен за любую помощь.

Адаптер application.js: 

import DS from 'ember-data';

export default DS.JSONAPIAdapter.extend({
  namespace: 'api'
});

Маршрут: 

import Route from '@ember/routing/route';

export default Route.extend({
  model() {
    //return this.store.createRecord('book');
    return {};
  },

  actions: {
    saveBook(newBook) {
      var curr = this.store.createRecord('book', {
        title: newBook.title,
        author: newBook.author,
        genre: newBook.genre
      });
      alert("curr.title = " + curr.title);
      curr.save();
      this.transitionTo('books');
    },
  }
});

Шаблон: 

<h2>Add Book</h2>

<div class="layout-row">
  {{!-- {{book-form model=model buttonLabel="Add Book" action='saveBook'}} --}}
  <div class="form-horizontal">
    <div class="layout-row">
      <div class="layout-column flex-200">
      {{paper-input label="Title" value=model.title onChange=(action (mut model.title))}}
      </div>
    </div>
    <div class="layout-row">
      <div class="layout-column flex-200">
      {{paper-input label="Author" value=model.author onChange=(action (mut model.author))}}
      </div>
    </div>
    <div class="layout-row">
      <div class="layout-column flex-200">
      {{paper-input label="Genre" value=model.genre onChange=(action (mut model.genre))}}
      </div>
    </div>
    <div class="layout-row">
      <button type="submit" {{action "saveBook" model}}>Save</button>
    </div>
  </div>
</div>

Результат просмотра с помощью Ember Inspector: 

{"data":{"id":"31","type":"books","attributes":{"title":null,"author":null,"genre":null}}}

1 Ответ

0 голосов
/ 25 апреля 2019

Я предпочитаю добавлять действие в форму при отправке действия, так как тогда ваша форма будет отправлена ​​при нажатии клавиши ввода или сохранения. 

<h2>Add Book</h2>

<div class="layout-row">

  <form class="form-horizontal" {{action "saveBook" on="submit"}}>
    <div class="layout-row">
      <div class="layout-column flex-200">
      {{paper-input label="Title" value=model.title onChange=(action (mut model.title))}}
      </div>
    </div>
    <div class="layout-row">
      <div class="layout-column flex-200">
      {{paper-input label="Author" value=model.author onChange=(action (mut model.author))}}
      </div>
    </div>
    <div class="layout-row">
      <div class="layout-column flex-200">
      {{paper-input label="Genre" value=model.genre onChange=(action (mut model.genre))}}
      </div>
    </div>
    <div class="layout-row">
      <button type="submit">Save</button>
    </div>
  </form>
</div>

Маршрут: 

import Route from '@ember/routing/route';

export default Route.extend({
  model() {
    return this.store.createRecord('book');
  }
});

Контроллер: 

import Controller from '@ember/controller';

export default Controller.extend({
  actions: {
    saveBook() {
      this.model.save().then(() => {
        this.transitionTo('books');
      });
    }
  }
});
...