meteor comments-ui: comments appear then immediately disappear

Question

I'm pretty new to Meteor and I'm struggling with arkham:comments-ui.

Here's a brief overview of what I'm doing. I hope it's not too detailed.

1. I'm subscribed to a published collection called 'articles'.

   Articles = new Mongo.Collection("articles");
   

2. I'm iterating through this on load to display a preview of each article in the client via a template named 'articlepreview'.

       Template.body.helpers({
           articles: function(){
               return Articles.find({}, {sort: {createdAt: -1}});
           }
       });
   

3. I've added the unique id of each article to a custom attribute (data-id) of the 'read more' button at the bottom of each preview.

   <template name="articlepreview">
        <h2>{{head}}</h2>
        <p>{{{summary}}}</p>
        <p class="readmore" data-id="{{_id}}">Read more</p>
   </template>
   

4. I've added an event listener for this button which gets the custom attribute and calls a function to display the full article that was clicked as well as setting a Session variable with the unique id.

           "click .readmore": function (event) {
               event.preventDefault();
               var articleID = event.target.getAttribute("data-id");
               Session.set('articleUID',articleID);
               Meteor.call("loadArticle", articleID);
           }
   

   5. This function populates a template named 'articlefull' via a helper; essentially I use Session.set to set a variable containing the text of the full article by using findOne with the unique ID that has been set.

HELPER:

        Template.articlefull.helpers({
            articlebody: function () {
                return Session.get('articlebody');
            },
            uniqueid: function(){
                return Session.get('articleUID');
            }
        });

TEMPLATE:

    <template name="articlefull">
        <div id="article">
            <p>{{{articlebody}}}</p>
        </div>
        <div id="comments" class="comment-section">
            {{> commentsBox id=uniqueid}}
        </div>
    </template>

6. Part of this template is a comment box. I'm setting the id of the comment box to match that of the article loaded, but something really odd happens at this point: the comments box allows me to type a comment and click 'Add', but once I do the comment briefly flashes on the screen and then disappears.

Any thoughts on what I'm doing wrong? If I pop {{uniqueid}} into the template just below the comment box it displays the right value, which means it is getting pulled through, but something is still going wrong...

PS: Please also tell me if I'm going about this in totally the wrong way. I'm sure there's a simpler way to do what I'm trying to but as I said, I'm new to this. Thanks!

Answer 1

Based on your detailed description about your implementation, I assume that this issue occurs due to a missing publish and subscribe function for your Comments collection.

Depending on your use case, you'll need to add Meteor.publish(name, func) and Meteor.subscribe(name, [arg1, arg2...], [callbacks]) functions.

Meteor.publish('allComments', function() {
  return Comments.getAll();
});

Meteor.publish('articleComments', function(docId) {
  return Comments.get(docId);
});

---

Meteor.subscribe('allComments');

Meteor.subscribe('articleComments', Session.get('articleUID'));