Warning: file_get_contents(/data/phpspider/zhask/data//catemap/8/meteor/3.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 流星模板更新_Javascript_Meteor - Fatal编程技术网

Javascript 流星模板更新

Javascript 流星模板更新,javascript,meteor,Javascript,Meteor,我是新来的流星。我做了一个简单的测试,却被困在了非常简单的部分。我的网页内容仅在数据库更改时更新,但当返回结果的函数更改时,如何强制更新?以下是我的应用程序的部分代码: client.js: Meteor.subscribe("tasks"); var search_query = ""; Template.page.tasks = function() { return Tasks.find({title: {$regex: search_query}}); }; Templat

我是新来的流星。我做了一个简单的测试,却被困在了非常简单的部分。我的网页内容仅在数据库更改时更新,但当返回结果的函数更改时,如何强制更新?以下是我的应用程序的部分代码:

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>

任务清单
{{>page}
收藏待办事项
{{{#每个任务}
{{>任务}
{{/每个}}
&时代;
{{#如果完成}
✓
{{else}
✓
{{/if}
{{title}}
{{creator}}
{{description}}

所以现在,我希望每当用户在input.search框变量
search\u query
中键入内容时,现在
Template.page.tasks
会返回不同的结果。但是没有什么真正的更新。您可以在

上查看应用程序。您需要一个应用程序来再次动态运行搜索。使
search\u query
a
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());
    }
});

谢谢,它起作用了。但现在,每次模板更新文本从我的搜索字段中消失。看起来页面被刷新了。你能给我一些提示吗,我怎样才能构建更好的用户界面?我显然可以设置
,并手动将焦点放在它上面,但当页面刷新时,如何保留用户输入仍然有点奇怪。