Meteor.js將項目從一個集合移動到另一個集合
[英]Meteor.js moving items from one collection to another
問題描述
因此，我正在嘗試為學校的一個項目開發一個食品雜貨清單應用程序。 我想要的是使用戶能夠列出項目清單，然后在找到他們時將其移動到“找到的項目”清單中，同時輸入項目的銷售價格。 我對他們正在尋找的項目有兩個Mongo集合“項目”，對於他們所發現的項目有“ Found_items”。 我在將項目從Items移到Found_items時遇到了麻煩。 它們確實已從Items中刪除，但似乎沒有放入Found_items中，或者至少它們沒有出現在UI中。 我很確定他們的問題出在當您單擊“找到”按鈕時發生的事情。 我的代碼如下...
project.html
<head>
<title>Grocery List</title>
</head>
<body>
<div class="container">
<header>
<h1>Grocery List</h1>
<form class="new-item">
<input type="text" name="text" placeholder="Type to add new items" />
</form>
</header>
<ul>
{{#each items}}
{{> item}}
{{/each}}
</ul>
</div>
<div class="container">
<header>
<h1>Items Found</h1>
</header>
<ul>
{{#each found_items}}
{{> found}}
{{/each}}
</ul>
</div>
</body>
<template name="item">
<li>
<button class="found">Got it!</button>
<input type="number" name="price" placeholder="Sale Price" />
<span class="text">{{text}}</span>
</li>
</template>
<template name="found">
<li>
<span class="text">{{text}}</span>
</li>
</template>
project.js
Items = new Mongo.Collection("items");
Found_items = new Mongo.Collection("found_items");
if (Meteor.isClient) {
// This code only runs on the client
Template.body.helpers({
items: function () {
return Items.find({});
},
found_items: function () {
return Found_items.find({});
}
});
Template.body.events({
"submit .new-item": function (event) {
event.preventDefault();
var text = event.target.text.value;
Items.insert({
text: text
});
event.target.text.value = "";
}
});
Template.item.events({
"click .found": function (event) {
Items.remove(this._id);
event.preventDefault();
var price = event.target.price.value;
var text = event.target.text.value;
Found_items.insert({
text: text,
price: price
});
}
});
}
關於我在做什么錯的任何解釋將不勝感激。
2 個解決方案
解決方案1
2 已采納 2015-11-26 04:56:52
唯一的問題是您的“ click.found”處理程序，因為event.target是按鈕，它沒有price或text屬性。
更改為：
Template.item.events({
"click .found": function (event) {
event.preventDefault();
var price = Template.instance().find('[name="price"]').value;
var text = Template.instance().find('.text').textContent;
Items.remove(this._id);
Found_items.insert({
text: text,
price: price
});
此外，事件處理程序還傳遞了兩個參數，即事件對象和定義處理程序的模板實例。 因此，您可以將其更改為：
Template.item.events({
"click .found": function (event, template) {
event.preventDefault();
var price = template.find('[name="price"]').value;
var text = template.find('.text').textContent;
...
});
因為this包含用於創建此（項目）模板的數據上下文，所以您可以進一步簡化為：
"click .found": function (event, template) {
this.price = template.find('[name="price"]').value;
Items.remove(this._id);
Found_items.insert(this);
}
event.preventDefault（）也已刪除，因為沒有可防止對此目標進行默認操作的操作（其他事件（表單submit事件）則需要此操作）。
解決方案2
0 2015-11-26 04:48:38
只需執行Found_items.insert(this)
確保您正在正確發布和訂閱此收藏集。
Meteor.js 只更新一個參數而不是整個集合
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.