Question

我是Meteor和mongo noob（现在是一个巨大的Meteor粉丝），我正在努力实现如何在Meteor中实现查找收集。

情境：

我有自定义颜色的产品（用户定义/未知数量）
用户可以添加自己的自定义颜色，然后转到产品页面并从颜色选择框中选择他们想要的颜色用于该产品
如果用户返回并修改颜色页面上的颜色十六进制值（并保存），则产品（在产品页面上）会反映新的colorHex值

我正在尝试做什么：

允许用户返回并修改颜色页面上预先存在的颜色
将颜色十六进制值更改反映在产品页面上
尝试不重复不同集合上的数据（并担心如果更新失败，请在多个集合/数据不一致的情况下更新数据）

最初我设置我的产品架构以保存颜色数据（非规范化数据），但是当颜色更新时，它不会在排版文档上更新。我已经看到你可以使用observeChange的观察来基本上听取变化，然后进行其他更改，尽管这似乎比它需要的更复杂。 有没有办法可以为添加到特定产品的所有颜色引用颜色集合，以便在产品页面上反映出任何变化？

以下是我一直在研究的一些代码。我正在使用collection2和iron：路由器，如果这有助于任何。我已经尝试连接两个集合，虽然这不是我所追求的，因为每个循环也循环遍历颜色（不需要）。

感谢任何帮助。先感谢您！ -Chris

ProductPage帮助：

Template.productPageTpl.helpers({
  ownProduct: function() {
    return this.userId === Meteor.userId();
  },

  productItems: function() {
    return ProductCollection.find({productId: this._id});
  },

  colorsItems: function() {
    return ColorsCollection.find({productId: this._id});
  },

  // This is my attempt and although give me back both collections, 
  // I only need to reference the colors.
  productAndColorsItems: function() {
    var product = ProductCollection.find({productId: this._id}).fetch();
    var colors = ColorsCollection.find({productId: this._id}).fetch();
    var productColorsJoin = product.concat(colors);
    console.log(productColorsJoin);
    return _.sortBy(productColorsJoin, function(doc) {return doc.createdAt;});
  }
});

产品页面html：

<template name="productPageTpl">
  <div class="product">
    {{#each productAndColorsItems}}
      {{> productItemTpl}}
    {{/each}}
  </div>
</template>

// All the {{properties}} below reference the ProductCollection except for the {{colorHex}}
// {{colorHex}} is a property on the ColorsCollection
<template name="productItemTpl">
  <div id="product-sentence-js" 
       style="color: #{{colorHex}};
              font-family: {{fontFamily}};
              font-weight: {{fontWeight}};
              font-size: {{fontSize}}{{fontUnit}};
              font-style: {{fontStyle}};
              text-transform: {{fontTextTransform}};
              line-height: {{fontLineHeight}}{{fontLineHeightUnit}};
              padding: {{fontPaddingTop}}{{fontPaddingTopUnit}} {{fontPaddingRight}}       {{fontPaddingTopUnit}} {{fontPaddingBottom}}{{fontPaddingTopUnit}} {{fontPaddingLeft}}{{fontPaddingTopUnit}};
              margin: {{fontMarginTop}}{{fontMarginTopUnit}} {{fontMarginRight}}{{fontMarginTopUnit}} {{fontMarginBottom}}{{fontMarginTopUnit}} {{fontMarginLeft}}{{fontMarginTopUnit}};">
    {{productSentence}}
  </div>
</template>

色彩收集模式

ColorsCollection = new Mongo.Collection('colors');

var Schema = {};

Schema.ColorsCollectionSchema = new SimpleSchema({
  productId: {
    type: String,
    label: "Product Id",
    max: 500
  },
  userId: {
    type: String,
    label: "User Id",
    max: 500
  },
  author: {
    type: String,
    label: "Author",
    max: 500
  },
  submitted: {
    type: Date,
    label: "Submitted",
    max: 500
  },
  colorName: {
    type: String,
    label: "Color Name",
    max: 500
  },
  colorHexValue: {
    type: String,
    label: "Color Hex Value",
    max: 500
  },
  colorHexValueId: {
    type: String,
    label: "Color Hex Value Id",
    max: 500
  }
});

ColorsCollection.attachSchema(Schema.ColorsCollectionSchema);

因此，简而言之，只要用户更改颜色页面上的颜色，就会使用新的十六进制值（在ColorsCollection中）更新颜色文档，并且所有使用该颜色的产品现在都会反映出这种颜色十六进制值。

Answer 1

这是我提出的解决方案。我欢迎任何替代/流星最佳实践方法。

<强>首先

我实现了本文（https://gentlenode.com/journal/meteor-6-reactive-and-nonreactive-join-with-mongodb/12）中概述的反应式publist（包）。这是一个很好的帮助，因为它允许服务器下推已经呈现的页面的更改。

<强>第二

我实现了以下代码。基本上我通过引用Meteor给予该记录的id（不会发生变化）来找到用户选择编辑的特定颜色。选择框的值设置为颜色ID，并使用数据值保存实际的十六进制值。绝不是完美的，但是当用户编辑颜色值时，产品项目会立即更新，以及选择框值。

Template.productItemTpl.helpers({
  productItemColorHexValue: function() {
    var allColors =  ColorsCollection.findOne({colorHexValueId: this.productColorHexValueId});
    return allColors.colorHexValue;
  }
});

<template name="productColorsSelectOptionsTpl">
    {{#each productColorsSelectOptions}}
      <option data-colorhexvalue="{{colorHexValue}}" value="{{colorHexValueId}}">{{colorName}}     </option>
    {{/each}}
</template>

Meteor / Mongo - 你如何引用查找集合？（去标准化与标准化）

1 个答案:

Meteor / Mongo - 你如何引用查找集合？ （去标准化与标准化）

1 个答案:

Meteor / Mongo - 你如何引用查找集合？（去标准化与标准化）