Вложенный сегмент динамического маршрута emberjs возвращает значение null и не может обновить дочернюю запись

Я пытаюсь реализовать комментарий, чтобы отобразить список комментариев, относящихся к одному сообщению. Затем нажмите «Изменить» и отредактируйте любой из выбранных комментариев из всех комментариев, принадлежащих одному сообщению.

Обновлен jsfiddle.

Я могу создать комментарий, принадлежащий выбранному сообщению, как показано в скрипте выше. **Однако я не могу обновить существующий комментарий, а форма редактирования комментария даже не отображает комментарий. Он всегда пуст и не привязан ни к какому существующему комментарию.

Нажав на editcomment, вы увидите URL-адрес posts/2/comments/undefined/edit. Это связано с тем, что EmBlog.PostCommentRoute и PostEditCommentRoute по-прежнему возвращают значение null.

Весь закомментированный код — это различные неудачные попытки заставить его работать. Я оставил их здесь, чтобы любой, кто смотрит на вопрос, знал, что я пробовал до сих пор.

Два маршрута, которые всегда возвращают значение null и, скорее всего, вызывают проблему

 EmBlog.PostEditCommentRoute = Ember.Route.extend({
  model: function(params) {
   var commentEdit = this.modelFor('post').get('comments');
   return commentEdit.get(params.comment_id);

   //return EmBlog.Comment.find({post: post.get('id'), id: params.comment_id});

   //var comment = this.modelFor('post').get('comments');
   //return comment.filterProperty('id', params.comment_id);  
  },

  setupcontroller: function( controller, model) {
  controller.set('content', model);
  }
});

Маршрут комментариев для отображения одного сообщения

EmBlog.PostCommentRoute = Ember.Route.extend({
  model: function(params){  
     comment = this.modelFor('post').get('comments');
    // comment = EmBlog.Comment.find(params.comment_id);

    return comment.get(params.comment_id);
    // return comment.filterProperty('body', params.comment_id);
  },

  setupController: function(controller, model) {
    //var comment = this.controllerFor('postComments').get('body');
    //controller.set('content', comment.filterProperty('body', model));

    controller.set('content', model);
  },

});

Это роутер. Я пробовал другие комбинации вложенности, но остановился на этой, потому что это была единственная версия, которая позволяла добавлять комментарии к работе, поэтому этот вопрос сосредоточен только на обновлении вложенного динамического сегмента, иначе я бы спрашивал об обоих:

 EmBlog.Router.map(function() {
    this.resource("posts", {path: '/posts'}, function(){
      this.route('new');

      this.resource('post', {path: '/:post_id/'}, function(){
        this.route('edit', {path: '/edit'});
        this.route('comments', {path:  '/comments'});
        this.route('newComment');
        this.route('comment', {path: '/comments/:comment_id'});    
        this.route('editComment', {path: '/comments/:comment_id/edit'});       
     }); 
   });
});

person Community    schedule 10.04.2013    source источник
comment
здесь это продвигает вас немного дальше. Я получаю правильный путь для редактирования комментария, и содержимое отображается в текстовой области комментария. jsfiddle.net/VRR2T/4 Основная проблема заключалась в вашем контексте, где все испортилось. Я предполагаю, что вы хотели перебрать все комментарии, отобразить их со ссылкой на редактирование, а затем получить ссылку для добавления нового.   -  person Fred Jiles    schedule 13.04.2013
comment
Большое спасибо, Фред. Да, ваши предположения верны, и теперь все работает.   -  person brg    schedule 13.04.2013


Ответы (3)


Изменил петлю. Раньше вы не передавали контекст, поэтому вы становились неопределенными в пути. Теперь вы передаете каждый комментарий в linkTo, чтобы он мог сгенерировать правильный маршрут. Вот ссылка на обновленную скрипту http://jsfiddle.net/VrR2T/4/

<script type="text/x-handlebars" data-template-name="post/comments">
  <h1> Yes Comments template</h1>

    <p> {{#linkTo "post.newComment"}} Add comment{{/linkTo}}</p>
    <br/>
    {{#each comment in content}}
        <br/>
          {{comment.body}} <br/> 
     <p>{{#linkTo "post.editComment" comment}} Edit Comment {{/linkTo}}</p>

    {{/each}}
  {{outlet}}
</script>

Вот обновленная форма. нужно привязать к content.body

<script type="text/x-handlebars" data-template-name="post/_commentForm">
   <form {{action save on='submit'}}>
{{view Ember.TextArea valueBinding="content.body" placeholder="body"}}
<button type="submit"> save comment </button> 
 <button {{action 'cancel' content}}> Cancel</button>
</form>
</script>
person Community    schedule 12.04.2013
comment
Я попытался присудить вам награду, и вспыхнуло сообщение красным, что я могу присудить ее через 17 часов. Так что я награжу его сразу же, stackoverflow позволит мне это сделать. Большое спасибо еще раз. - person brg; 13.04.2013
comment
Спасибо рад что смог помочь - person Fred Jiles; 13.04.2013

Я скачал ваш код со скрипки и обнаружил несколько проблем.

Первый

Вы случайно использовали Ember.Router вместо Ember.Route ниже.

EmBlog.PostCommentsRoute = Ember.Router.extend({
// ...
EmBlog.PostCommentRoute = Ember.Router.extend({

Должно быть

EmBlog.PostCommentsRoute = Ember.Route.extend({
// ...
EmBlog.PostCommentRoute = Ember.Route.extend({

Второй

Вам не нужно было переопределять model в этом маршруте, поведение Ember по умолчанию в порядке. Вы также ссылаетесь на params_id, когда эта переменная не была объявлена.

EmBlog.PostRoute = Ember.Route.extend({
  model: function(params) {
     post = this.modelFor('posts');
     return post.get(params_id);
    //return EmBlog.Post.find(params.post_id);
    //return this.modelFor('post').filterProperty('id', params.post_id);
  },

Третий

в ответ на ваш комментарий ниже

Проблема в том, что вы ссылаетесь на editComment из контекста поста, а не самого комментария. Как только это было исправлено, я также изменил TextArea на model.body вместо body.

Изменения перечислены в этом Gist. Теперь необходимо выполнить редактирование.

person Community    schedule 11.04.2013
comment
Спасибо @mutwinter. Я обновил jsfiddle с исправлениями. У меня есть 1 проблема: EmBlog.PostCommentRoute и PostEditCommentRoute по-прежнему возвращают значение null. Нажав на редактирование комментария, вы увидите URL-адрес posts/2/comments/undefined/edit. В jsfidde вы увидите, что я пробовал различные известные мне методы, используя различные перестановки, чтобы убедиться, что они работают, а затем я закомментировал каждый из них, который не работал, но оставил их в коде, чтобы знать, что я пробовал. Это также означает, что хотя отображается форма для редактирования комментария, она не привязывается к какому-либо существующему комментарию. Спасибо - person brg; 12.04.2013

проблема 1: я думаю, это помогло бы, если бы вы не изменили путь и сохранили его как «/: post_id»

проблема 2: извините, я не думаю, что могу помочь здесь.

person Finn MacCool    schedule 10.04.2013
comment
Спасибо @finn. Я изменю путь обратно на '/:post_id' и попробую оттуда. Спасибо за ваше время. - person brg; 10.04.2013
comment
нп. Кроме того, поскольку вы также работаете над блогом, возможно, вы можете использовать часть кода здесь . - person Finn MacCool; 10.04.2013
comment
хорошо, спасибо, я посмотрю исходный код в этом репо. огромное спасибо. - person brg; 10.04.2013
comment
почему бы нет? я думаю, что путь вполне может быть причиной того, что его код не работает. я могу ошибаться, но тем не менее это ответ. - person Finn MacCool; 10.04.2013
comment
@finn, в обновленной скрипте я сохранил путь '/: post_id и обычно использовал структуру, которую вы предложили в другом вопросе. но шаблон комментариев все еще не отображается и все шаблоны, вложенные в него. Я переформулировал свой вопрос и удалил все ссылки на рельсы, так как проблема на самом деле в emberjs. - person brg; 11.04.2013
comment
Мне только что удалось отобразить основной шаблон комментариев с помощью помощника рендеринга, но не помощника #linkTo. Но шаблоны, вложенные в comment.hbs, по-прежнему не отображаются. Я снова обновил jsfiddle. - person brg; 11.04.2013
comment
Отлично, шаблоны, вложенные в comments.hbs, теперь отображаются, но #linkTo не работает. jsfiddle обновите снова. - person brg; 11.04.2013
comment
хм, вы ссылаетесь на «comments.index», но я не могу найти какой-либо шаблон «comments/index» или соответствующее представление, которое использует другой шаблон (или соответствующий маршрут или контроллер, если на то пошло). Кроме того, я все еще думаю, что маршруты комментариев должны быть изменены, но, возможно, это просто мой вкус. - person Finn MacCool; 11.04.2013
comment
p.s.: я не знаю, работает это или нет, но я бы не стал помещать кнопку внутри ссылки, как вы делаете в шаблоне «комментарии/комментарии». я бы либо использовал ссылку и вызвал действие в хуке setupController соответствующего маршрута, либо использовал кнопку и вызвал transitionToRoute где-нибудь в действии. - person Finn MacCool; 11.04.2013
comment
Хорошо, я постараюсь вытащить кнопку и не заключать ее в ссылку. ваше здоровье - person brg; 11.04.2013