CODEWITHSUNDEEP
meteor
Charles Zhu
Charles Zhu

Reputation: 27

Meteor reactive variables: Got my reactive computation + reactive source, but not reacting

I'm trying to re-render a collection of words in a column every time a word is submitted or deleted. It re-renders when the word is deleted but not when a word is submitted.

Here's my template:

<template name = "wordColumn">
  {{#each words}}
  <button class = "label label-default" draggable="true">
    {{word}}
  </button>
  {{/each}}
</template>

Here's my helper:

Template.wordColumn.helpers ( { 
    words: function () {
        var words;
        var wordIds = Session.get ( "wordIds" );
        words = Words.find( { '_id': { $in: wordIds } }, { sort: { createdAt: -1 } } );
        return words;
    },
} )

And here is the word submit code within the template events. When I do Words.find(), it's clear that the underlying database has changed so Words.find() above should be reactive and update the column automatically:

"submit .new-word": function ( e ) {
    var text = e.target.word.value;
    Meteor.call ( "addWord" , text, function ( err, data ) {
        Session.set ( "displayInMainBox", Words.find( data ).fetch()[0] );
    } );
    e.target.word.value = "";
    return false;
}

Yet no cigar - the word I just submitted doesn't display automatically unless I refresh the page.

You can check out the deployed app here: contextual.meteor.com, and submit a new word. It'll show in the main box but not the list of all words on the right-hand side.

Upvotes: 0

Views: 52

Answers (1)

Matt K
Matt K

Reputation: 4948

You need to have a Session.set( "wordIds"... somewhere in that callback. If that doesn't change, your cursor in your helper won't change. Since your current cursor includes all the current docs, when you delete something it will react.

PS, try doing away with the session var all together. Handle that logic in the subscription if possible (or sub to all, from the look of the app).

Upvotes: 1

Related Questions