meteor-tabular
meteor-tabular copied to clipboard
Problem pagination in joined collections: template does NOT load data
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 https://www.youtube.com/watch?v=rVsEUsc9TTU
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>
Hi guys,
I found a solution: use peerlibrary:meteor-reactive-publish as your publication manager - see https://forums.meteor.com/t/aldeed-tabular-problem-templatecell-does-not-update-on-pagination-when-joining/27237.
@aldeed: Do you want to add an peerlibrary:meteor-reactive-publish-example to your README? For me using peerlibrary:meteor-reactive-publish instead of reywood:publish-composite a different publication-package did the trick. Maybe I had some bug in my ``reywood:publish-composite`-code? Anyways this the code
This is the code I use for the publication:
// peerlibrary:meteor-reactive-publish
Meteor.publish('tabular.posts.autorun', function (tableName, ids, fields) {
this.autorun(function (computation) {
check(tableName, String)
check(ids, Array)
check(fields, Match.Optional(Object))
const posts = Posts.find({_id: {$in: ids}}, { fields: fields })
// aggregate authors and comments
const authorIds = []
let commentIds = []
posts.forEach(function (post) {
authorIds.push(post.authorId)
commentIds = _.union(commentIds, post.commentIds)
})
const authors = Authors.find({ _id: { $in: authorIds }}, { fields: fields } )
const comments = Comments.find({ _id: { $in: commentIds} }, { fields: fields })
// return multiple cursors
return [posts, authors, comments]
})
})