jeudi 12 novembre 2015

Ember js comments tree

I try create a "comments tree" using Emberjs in my project.

How can I create and add child comment ?

This is simple example from my project:

template/post.hbs

    ...
    <div class="comment-list">
       {{comment-form}}
       {{#each comments as |comment|}}
         {{comment-item comment=comment}}
       {{/each}}
    </div>

template/components/comment-item.hbs

<div class="comment">
  <div class="author">{{comment.author}}</div>
  <div class="content">{{comment.content}}</div>
  <div class="reply">
    {{comment-form}}
  </div>
</div>

template/components/comment-form.hbs

<form {{action 'submit'}}>
  {{textarea value=comment.content}}
  <button type="submit">Submit</button>
</form>

components/comment-form.js

  didInsertElement: function() {
    var comment = {content: '', toUser: this.get('user.id'), parentComment:  this.get('_controller.comment.id')};
    this.controller.set('comment', comment);
  },
  actions: {
    submit: function() {
      this.sendAction('action', this.get('comment'));
    }
  }

route/post.js

model: function() {
  return this.store.findAll('comment', modelFor('user').id);
}

setupController: function(controller, model) {
  controller.set('comments', model);
}

Aucun commentaire:

Enregistrer un commentaire