Meteor réactif var pas rendu uniformément

Question

J'ai lu toutes les questions réactives var ici plus this meteorchef article et j'ai encore des problèmes avec mon application.

foo.js:

Template.pwdStrength.onCreated(function() { 
     this.reason = new ReactiveVar('Empty password'); 
    }); 

    Template.pwdStrength.helpers({ 
    reason: function() { 
     return Template.instance().reason.get(); 
    }, 
    }); 

    Template.pwdStrength.events({ 
    'input #at-field-password': function(event, template) { 
     const contents = event.currentTarget.value; 
     // call strength computation here... 
     if (contents.length < 8) { 
     Template.instance().reason.set('Password is too short'); 
     } else { 
     Template.instance().reason.set("We don't like that password"); 
     } 
    } 
    }); 

foo.html:

<template name='pwdStrength1'> 
{{> atTextInput}} 
    <span data-toggle='tooltip' data-placement='top' title="{{reason}}"> 
    <ul id="strength" check-strength="pw" style="{display: inline;}"> 
     <li class="point" style="{{style 1}}"></li> 
     <li class="point" style="{{style 2}}"></li> 
     <li class="point" style="{{style 3}}"></li> 
     <li class="point" style="{{style 4}}"></li> 
     <li class="point" style="{{style 5}}"></li> 
    </ul> 
    </span> 
</template> 

L'objectif est d'afficher une info-bulle au-dessus de l'indicateur de puissance de mot de passe avec la raison qui a été fixé par l'événement d'entrée. L'info-bulle s'affiche en tant que "Mot de passe vide" même après la saisie du texte dans le champ du mot de passe. Mais si j'ajoute une ligne avec juste {{reason}} en haut du modèle, la raison est affichée sur la page, PLUS l'info-bulle fonctionne maintenant comme prévu et montre la raison de la mise à jour. Si j'utilise CSS pour masquer le {{reason}}, l'info-bulle cesse de fonctionner. Il semble que l'assistant modèle doit être rendu avant de rendre celui de la balise. Qu'est-ce que je fais mal?

Dernière Meteor, twbs: bootstrap, comptes: templates.

---

EDIT

Gave sur cela parce que l'interface utilisateur intuitive et n'a pas été infobulles juste obtenu de la manière. Jamais réellement trouvé une solution au problème.

Answer 1

Utilisez template.reason.set ('Le mot de passe est trop court'); Au lieu de Template.instance(). Reason.set ('Le mot de passe est trop court');