Hi guys,
I am playing around with client-side joins in combination with aldeed:tabular and reywood:publish-composite and ran into a problem getting custom columnTemplates to work.
The problem is that in the below example the column Template.commentsColumn
does NOT refresh correctly when paginating. Strangly postCommentsBadAssButWorks
shows the correct data. So I am guessing it is NOT the publication, but the reactivity within the template?
Does anyone have an idea what I am doing wrong?
This is a video I did showing the problem
This is a code-excerpt:
Table Definition
import { Authors, Comments, Posts } from '/lib/collection.js'
export const PostsTable = new Tabular.Table({
name: 'Posts',
collection: Posts,
pub: 'tabular.posts',
extraFields: [
'authorId',
'commentIds',
],
pageLength: 30,
columns: [
{data: '_id', title: '#ID'},
{data: 'post', title: 'Post'},
{data: 'postAuthor()', title: 'Author Name'},
{
title: 'CommentsIds',
data: 'this', // set data for sort-option & template-context!
tmpl: Meteor.isClient && Template.commentIdsColumn,
tmplContext: function (rowData) {
return {
doc: rowData,
};
}
},
{data: 'postCommentsBadAssButWorks()', title: 'Comments Collection-Helper (WORKS)'},
{
title: 'Comments CustomColumnTemplate (PROBLEM)',
// data: 'this', // set data for sort-option & template-context!
tmpl: Meteor.isClient && Template.commentsColumn,
// tmplContext: function (rowData) {
// return {
// doc: rowData,
// };
// }
},
]
})
Collection Helper
// COLLECTION HELPER for tabular!!!
Posts.helpers({
postAuthor: function() {
return Authors.findOne(this.authorId).author
},
postComments: function() {
// This does NOT seem to RELOAD in the tempalte
log(`postComments collection helper`)
// return Comments.find({_id: { $in: this.commentIds } }).fetch() does NOT work either
return Comments.find({_id: { $in: this.commentIds } })
},
postCommentsBadAssButWorks: function() {
// This works but is BAAD
let html = '<ul>'
Comments.find({_id: { $in: this.commentIds } }).forEach(function (comment) {
html += `<li>${comment.comment}</li>`
})
html += '</ul>'
return html
},
})
Template
<template name="commentsColumn">
<ul>
{{#each this.postComments}}
<li>{{this.comment}}</li>
{{/each}}
</ul>
</template>