事件中的流星更新模板

Question

我剛開始使用Meteor，我非常喜歡它，但我認爲我在處理模板和事件時感覺不太反應。

在我的活動我有類似

Template.login.event({ 
    'submit form': function(e, t){ 
     var password = t.find('#password').value; 
     if (password.length < 5) return t.find('#error').innerHTML = 'password too short'; 

    // a bunch more stuff to handle success cases -- not important for this example 
    } 
}); 

在我的模板，我有

<template name="login"> 
    <span id="error"></span> 
    <form> 
    <input name="email" type="email" /> 
    <input name="password" type="password" id="password" /> 
    <form> 
</template> 

我想我應該以某種方式能夠這樣說 t.data.error = 'password too short所以我更新模板中的數據，並使用<span id="error">{{error}}</span>而不是直接更新html，但我似乎無法找到如何做到這一點。

Answer 1

您需要一個反應變量來將幫助者/事件粘合在一起。最簡單的方法是使用Session，雖然我不喜歡個人，由於其全球範圍內

Template.login.event({ 
    'submit form': function(e, t){ 
     e.preventDefault(); // should stop the form submission, check the condition and then continue with the submission if validation is correct 
     var password = t.find('#password').value; 
     if (password.length < 5) Session.set('error', "password too short"); 
    } 
}); 

Template.login.helpers({ 
    isFormInValid: function(){ 
     return Session.get('error') != null; 
    }, 
    errorMsg: function() { 
     return Session.get('error'); 
    } 
}); 

{{#if isFormInValid}} 
<span id="error">{{errorMsg}}</span> 
{{/if}}