javascript - 使用 mongoDB 数据初始化 Bootstrap colorpicker

Question

我有一个 meteor 应用程序，我添加了插件 colorpicker作为一个组件。 但我想用 MongoDB 集合中的值来初始化它。 因此，我初始化了输入文本(类似于 #32a214)，但我不知道如何初始化右侧小方 block 中的颜色。

在我的 html 文件中，我有:

<div class="form-group"><label class="col-sm-2 control-label">Color text image<br/></label>
    <div class="col-sm-10">
         <div id="colorText" class="input-group colorpicker-component">
            <input type="text" value={{textImageColor}} id="textImageColor" placeholder="Choose a color" class="form-control" />
            <span class="input-group-addon"><i></i></span>
        </div>
    </div>
</div>

在我的 javascript 文件中，我有:

Template.yourTile.rendered = function(){

    $('#colorText').colorpicker({
        color: "#32a214"
    });
}

所以我想用数据库中的值替换“#32a214”。 我想做这样的事情:

color: {{textImageColor}} 

但是这不起作用。 那么，你知道我该怎么做吗？

编辑:

我在服务器端有一段 JavaScript 代码:

Meteor.publish('tiles', function(){
  return tiles.find();
});

我通过助手获取数据:

Template.yourTile.helpers({
    'textImageColor': function(){
        var userID = Meteor.userId();
        var doc = tiles.findOne({createBy: userID });
        var textImageColor = doc && doc.textImageColor;
        if(textImageColor == ""){
            return "";
        }else{
            return textImageColor;
        }
    }
}

因此，如果我在 html 文件中调用 {{textImageColor}} ，它会起作用，但在 javascript 文件中则不起作用。 我想这可能是因为加载。颜色是在渲染中初始化的，因此如果我用 {{textImageColor}} 替换颜色，它将不起作用，因为该值尚未从 mongoDB 集合中加载。所以也许我需要等待才能获得值(value)，但我不知道该怎么做。

Answer 1

要成功进行发布/订阅，您需要满足以下所有条件:

1. 数据库中数据的集合
2. 客户端和服务器代码通用的集合定义
3. 服务器上的发布者
4. 客户端上的订阅者
5. 客户端上的 find()

看来您缺少#2。

在一些常见的代码中(例如/collections/tiles.js)，您需要定义集合。例如

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

当在服务器上运行时，它将确保集合存在于数据库中。在客户端，它将为客户端 find() 运行的集合创建一个 mini-mongo 实例。它还将为这些集合创建一个引用“tiles”。