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/