Question

情况

让我们将这个问题分解为一个简单的待办事项列表，其中的条目列在\ li中：

./test.sh '+123(0)223465'
http://example.com/dial.htm?number=+123223465

了Serverside：

//main.html
<ul>
{{ #each listEntries }}
  <li class="item">
   {{ title }}
  </li>
{{ /each }}
</ul>

现在我从客户端的控制台手动调用：

//main.js
TodoCollection = new Mongo.Collection('todo_collection');

到目前为止一切都很好。

现在meteor.JS以异步方式工作，这意味着客户端中所做的更改也会立即对DOM产生影响，而不知道数据库插入是否成功。如果没有，DOM元素将被再次移除（因此第一个meteor插入新的TodoCollection.insert({title: 'My first entry'});，然后如果插入失败则再次删除它。）

如何从流星获取实际来自数据库的信息？

我需要什么：

<li>

Answer 1

您可以使用集合的insert方法的回调。调用回调时出现错误（null如果没有）和存储在数据库中的对象Id

下面你可以看到测试它的代码：

<强> HTML ：

<head>
  <title>simple</title>
</head>

<body>
  <h1>Welcome to Meteor!</h1>
  {{>test}}
</body>

<template name="test">
  <ul>
      {{#each item in list}}
      <li>{{item.name}}</li>
      {{/each}}
  </ul>
  {{#if insertResult}}
  <div class="insert_result">{{insertResult}}</div>
  {{/if}}
  {{#if insertError}}
  <div class="insert_error">{{insertError}}</div>
  {{/if}}
  <form>
      <input type="text" name="name" />
      <input type="submit" value="Add" />
  </form>
</template>

<强>的Javascript ：

import { Template } from 'meteor/templating';
import { ReactiveVar } from 'meteor/reactive-var';

collection = new Mongo.Collection('collection');

if (Meteor.isClient) {
    Template.test.onCreated(function () {
        this.insertResult = new ReactiveVar();
        this.insertError = new ReactiveVar();
    });

    Template.test.helpers({
        list() {
            return collection.find();
        },
        insertResult() {
            return Template.instance().insertResult.get();
        },
    });

    Template.test.events({
        'submit form'(event, instance) {
            event.preventDefault();
            collection.insert({
                name: event.target.name.value
            },function(err,result) {
                if (err) {
                    instance.insertError.set(err);
                    instance.insertResult.set(null);
                } else {
                    instance.insertResult.set(result);
                    instance.insertError.set(null);
                }

            });
        },
    });
}

Answer 2

正如您在上一个答案中所看到的，在Meteor中了解导致反应性更新的原因非常麻烦。

我建议采用不同的方法：不要在客户端插入。对执行插入的服务器方法创建Meteor.call()，然后让客户端进行反应性更新。然后，您始终确保您在屏幕上看到的内容实际上在数据库中。

Answer 3

我想我自己找到了最简单的解决方案：在服务器端添加一个钩子，它将使用obj.onCreated = new Date();添加创建日期，这有助于识别它来自服务器，因为这在客户端上不存在。

  {{#each item}}
    {{ #if item.onCreated }}
      <li class="success-db">{{name}}</li>
    {{ else }}
      <li class="pending-db">{{name}}</li>
    {{ /if }}
  {{/each}}

（如果你发现它与Meteor.JS的工作方式相矛盾，请不要犹豫，改进这个答案）

Answer 4

如果要显示存在标题的数据，则可以像这样编写代码。

<ul>
{{ #each listEntries }}
  <li class="item">
   {{ title }}

   {{ #if title }}
     - i am actually stored!
   {{ /if }}
  </li>
{{ /each }}
</ul>

如何知道插入是否在使用Meteor.JS的MongoDB集合中成功（在模板内）

情况

到目前为止一切都很好。

我需要什么：

4 个答案: