ember.js - ember-cli: данные ember недоступны в дочернем представлении

Я использую последнюю версию ember-cli и в настоящее время тестирую ее, создавая очень простое приложение, используя ember-data и http-mock для RESTAdapter - ember generate http-mock api-server

Отдельный пост получим из API:

http://localhost:4200/api/api-server/posts/1

Результат

{"post":
   {
      "id":1,
      "title":"How to write a JavaScript Framework",
      "author":"Tomhuda Katzdale",
      "body":"Lorem ipsum dolor sit amet"
   }
}

Вот все соответствующие коды:

адаптеры

import DS from 'ember-data';

export default DS.RESTAdapter.extend({
   namespace: 'api/api-server'
});

модель

import DS from 'ember-data';

export default DS.Model.extend({
  title: DS.attr('string'),
  author: DS.attr('string'),
  body: DS.attr('string')
});

router.js

import Ember from 'ember';

var Router = Ember.Router.extend({
   location: EmbercliDataENV.locationType
});

Router.map(function() {
  this.route('application');
  this.resource('posts', function() {
     this.resource('post', { path: ':post_id' });
  });
});

export default Router;

Маршруты (посты и посты) - просмотр и дочерний просмотр

маршрут сообщений

import Ember from 'ember';

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

почтовый маршрут

import Ember from 'ember';

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

шаблон

posts.hbs

<h2>Posts List</h2>

<ul>
  {{#each}}
    <li>
       {{#link-to 'post' this}}{{title}}{{/link-to}} | {{author}} | {{body}}
    </li>
  {{/each}}
</ul>
{{outlet}}

пост hbs

<h2>Single Post</h2>

<p>Post title: {{title}}</p>
<p>Post author: {{author}}</p>
<p>Post body: {{body}}</p>

ПРОБЛЕМА: если вы посмотрите на снимок экрана ниже, в отладчике Chrome Ember модель с одним постом подключается к маршруту поста, но не печатается в post.hbs

Используя только стартовый комплект Ember, у меня не возникло никаких проблем с точно таким же приложением.

Спасибо за любую помощь, ура

ОБНОВИТЬ

Ниже приведено точно такое же приложение Ember, написанное с использованием начального набора, хоста в xampp и использования PHP Slim Framework для REST Api. Рабочая FINE!

3 ответа

Решение

После просмотра форума Ember.js я получил ответ там - http://discuss.emberjs.com/t/strange-behavior-w-retrieving-model-from-controller/6155

Похоже, что при использовании команды контроллера Ember generate у вас получается Ember.Controller, а не Ember.ObjectController или Ember.ArrayController lol.

Я редактирую свой пост-контроллер из: (сгенерировать командой Ember generate controller)

export default Ember.Controller.extend({
});

в

export default Ember.ObjectController.extend({
});

а сейчас модель обязательна:D

Попробуйте исправить ваши данные, потому что пост вложен в посты, попробуйте это:

{"post":[
   {
      "id":1,
      "title":"How to write a JavaScript Framework",
      "author":"Tomhuda Katzdale",
      "body":"Lorem ipsum dolor sit amet"
   }]
}

проверьте в ваших постах hbs, если данные видны, то пост должен нормально работать

<h2>Posts List</h2>

<ul>
  {{#each}}
    <li>
       {{#link-to 'post' post}}{{title}}{{/link-to}} | {{author}} | {{body}}
    </li>
  {{/each}}
</ul>
{{outlet}}

1.вместо "этого" используйте пост, надеюсь, это решит проблему http://emberjs.com/guides/templates/links/

Другие вопросы по тегам