流星火焰 - 在類之間進行區分

Question

在我當前的項目中，用戶可以創建帖子，並在頁面上迭代每個帖子。

我遇到了沖突類的問題。

我有一個復選框，讓課程attend但它與其他帖子和我創建的'click .attend'功能沖突。

有沒有辦法為每個帖子創建一個獨特的類？

我試過做：

<input type="checkbox" id="check" class="{{this._id}}" checked="" />

但功能不允許

'click .this._id'

我堅持做什么。

Answer 1

聽起來你會以一種錯誤的方式去做。 您可以擁有相同的類，但您需要為每個帖子添加模板。 該模板可以輕松訪問該模板的每個實例的正確類。

    <head>
  <title>demosub</title>
</head>

<body>
  <h1>Welcome to Meteor!</h1>

  {{> allposts}}

</body>
<template name="allposts">
   {{#each posts}}
      {{> thepost }}
   {{/each}}
</template>

<template name="thepost">
   <div>
     <span>{{_id}}</span>
      <input type="checkbox" class="attend" checked="" />
    </div>
</template>

然后在您的事件代碼中為模板'thepost'

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

import './main.html';


Template.allposts.helpers({
  posts() {
    return [{_id: 1}, {_id: 2}]
  },
});

Template.thepost.events({
  'click .attend': function(e,t){
    var data = Template.instance().data  // this is your post...
    console.log(e.toElement.checked)
    console.log(data)
  }
})

在下面你可以看到我點擊每個復選框的位置以及它如何知道點擊了哪個帖子： -

模板事件知道類“attend”上的click事件與模板的實例相關聯並調用該事件處理程序。

Answer 2

您不需要為每個帖子創建一個類。 看看Meteor todos教程 - 更新和刪除

這可能是您的HTML輸入

<input type="checkbox" class="yourcheckboxclass" checked="{{checked}}"/>

這可能是您的Javascript代碼

'change [type=checkbox]': function(e, tpl) {
     // Here you can access your post data with 'this' and use it 
     // to do what you want.
     console.log(this._id)
     }

注意：不要對每個帖子使用id="check" ，因為HTML中有幾個具有相同ID的項目。

流星火焰 - 在類之間進行區分

問題描述

2 個解決方案

解決方案1
0 已采納 2017-02-20 02:30:15

解決方案2
0 2017-02-20 09:20:06

流星火焰 - 在類之間進行區分

問題描述

2 個解決方案

解決方案1 0 已采納 2017-02-20 02:30:15

解決方案2 0 2017-02-20 09:20:06

解決方案1
0 已采納 2017-02-20 02:30:15

解決方案2
0 2017-02-20 09:20:06