流星反應變量不一致呈現

我已經通讀了所有的反應性var問題，加上 this meteorchef article，並且我的應用程序仍然有問題。流星反應變量不一致呈現

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>

我們的目標是在顯示與通過輸入事件設置的原因，密碼強度計的工具提示。即使在密碼字段中輸入文本後，工具提示也會顯示爲「空密碼」。但是，如果我在模板的頂部添加一行{{reason}}，原因將顯示在頁面上，PLUS工具提示現在按預期工作並顯示更新原因。如果我使用CSS隱藏{{reason}}，則工具提示停止工作。看起來模板助手必須在渲染標籤之前渲染。我究竟做錯了什麼？

最新的Meteor，twbs：bootstrap，accounts：templates。

編輯

放棄了這一點，因爲用戶界面不直觀和工具提示剛剛得到的方式。從來沒有真正找到解決問題的辦法。

來源

2017-04-19 Ronald Currier

使用template.reason.set（'密碼太短'）; 而不是Template.instance（）。reason.set（'Password is too short'）;

來源

2017-04-19 07:55:19

不，那麼無論是工具提示還是裸體{{reason}}都會得到更新。 –

也許它沒有達到如果塊試圖添加console.log（contents.length） –

流星反應變量不一致呈現

回答

相關問題