流星模板更新

我是流星的新手。我構建了簡單的測試，並且陷入了非常簡單的部分。我的網頁內容僅在數據庫更改時更新，但當函數返回結果更改時，如何強制更新它？下面是我的應用程序代碼的一部分：流星模板更新

client.js：

Meteor.subscribe("tasks"); 

var search_query = ""; 

Template.page.tasks = function() { 
    return Tasks.find({title: {$regex: search_query}}); 
}; 

Template.task.events({ 
    'click .checkmark': function() { 
     Tasks.update({_id: this._id}, {$set: {done: !this.done}}); 
    } 
}); 

Template.page.events({ 
    'keyup .search': function() { 
     search_query = $(".search").val(); 
    } 
});

todo.html：

<head> 
    <title>Todo list</title> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
</head> 

<body> 
    {{> page}} 
</body> 

<template name="page"> 
    <div class="tasks"> 
     <h1>Collections TODOs</h1> 
     <input type="text" class="search" placeholder="Search..."> 
     {{#each tasks}} 
      {{> task}} 
     {{/each}} 
    </div> 
</template> 

<template name="task"> 
    <div class="task well well-small"> 
     <button type="button" class="close cancel">&times;</button> 
     <h3> 
      {{#if done}} 
       <button type="button" class="checkmark done">&#10003;</button> 
      {{else}} 


    <button type="button" class="checkmark muted">&#10003;</button> 
     {{/if}} 
     {{title}} 
    </h3> 
    <div class="creator muted">{{creator}}</div> 
    <p>{{description}}</p> 
</div>

所以，現在，我希望每當用戶在輸入的東西。搜索框變量已更改，現在Template.page.tasks返回不同的結果。但沒有什麼更新。你可以看看應用程序http://slava.meteor.com

來源

2013-01-10 imslavko

你需要一個reactive variable再次動態運行搜索。讓一個Session變量這樣

Template.page.tasks = function() { 
    return Tasks.find({title: {$regex: Session.get("search_query") }}); 
};

而在你的事件：

Template.page.events({ 
    'keyup .search': function() { 
     Session.set("search_query", $(".search").val()); 
    } 
});

來源

2013-01-10 23:09:41 TimDog

謝謝，它的工作原理。但是現在，每次模板更新我的搜索字段dissappers文本。所以看起來像頁面得到刷新。你可以提供任何提示，我如何建立更好的用戶界面？ – imslavko

我顯然可以設置''並且手動將焦點放在它上面，但它仍然有點奇怪 – imslavko

請參閱[preseve-input]（http://docs.meteor.com/#template_preserve），以便在頁面刷新時保留用戶輸入。 –

流星模板更新

回答

相關問題