Question

此代码尝试通过方法调用显示集合中的项目，以防止客户端更改collection.find选项中的查询选择。

修改存在“组”字段的原因是稍后服务器将更改组，并且预期菜单的项目将改变以反映新组。

为什么我没有显示任何项目以及如何修复它？感谢

///////////////////////////
//   client/client       //
///////////////////////////
<template name="mainMenu">
  <div class="container">
    <div class="row">
      <section class="col-xs-12">
        <div class="list-group menuItems">
          {{#each menuItems}}
            <li data-template="{{menuItem}}" role="presentation">
              <a href="#" class="list-group-item menuItem">
                <img src="/abc.png">
                {{menuItem}} <span class="badge">&#x3e;</span>
              </a>
            </li>
          {{/each}}
        </div>
      </section>
    </div>
  </div>
</template>

Template.mainMenu.helpers({
  menuItems: function () {
    return Meteor.call('getMenuItems');
  }
});

/////////////////////////////////////
//       server side code
/////////////////////////////////////
var items =
  [
    {menuItem: "task1",group: "a"},
    {menuItem: "task2",group: "a"},
    {menuItem: "task3",group: "b"},
    {menuItem: "task4",group: "a"},
    {menuItem: "task5",group: "a"},
    {menuItem: "task6",group: "a"},
    {menuItem: "task7",group: "b"},
    {menuItem: "task8",group: "b"},
    {menuItem: "task9",group: "b"},
    {menuItem: "login",group: "a"},
    {menuItem: "logout",group: "a"}
  ]
_.each(items, function (doc) {
  MenuItems.insert(doc);
})

Meteor.methods({
    getMenuItems: function () {
            return MenuItems.find({group: 'a'});
    }
});

Answer 1

该行

return Meteor.call('getMenuItems');

不是从服务器获取数据的正确语法。您需要使用回调并将其设置为反应式var才能显示到模板

其次，从帮助者调用服务器是错误的（在这种情况下）。需要从onRendered

触发调用

Template.mainMenu.onRendered = function() {
    Meteor.call('getMenuItems', function(err, res) { 
        Session.set('menuItems', res);
    });
}

Template.mainMenu.helpers({
    menuItems: function () {
       return Session.get('menuItems');
    }
});

<强>更新使用更新的问题，由于您希望菜单上有反应，因此需要使用评论中提到的@MichelFloyd等发布来检索数据。

将模板更改为

Template.mainMenu.onCreated = function() {
    Meteor.subscribe('menuItems', 'a');  
}



Template.mainMenu.helpers({
    menuItems: function () {
        return MenuItems.find();
    }
});

并删除Meteor.call。在您的服务器上，制作出版物

Meteor.publish('menuItems', function(group) {
   return MenuItems.find({group: group});
});

Answer 2

该方法是异步的，只能通过回调返回数据，回调需要在传递方法的任何变量之后声明

选项1 - 会话变量

Meteor.call ('my-method', var1, ..., varx, function (err, data){      
if (err)         
   console.log (err);       
else          
   Session.set('method-data', data);    
});

然后你可以在模板帮助器中使用session var，一旦方法返回你的帮助器就会重新渲染。

选项2 - Reactive vars

如果您不想污染会话，您可以随时使用reactive-var包在模板上设置反应变量，如下所示，您需要先添加反应性var包

meteor add reactive-var

然后在你的模板中创建函数声明一个附加到self的反应性var，它被设置为this（模板实例本身）。调用方法并在回调中使用self来设置反应变量。

var self = this;
self.methodData = new ReactiveVar(false); 
Meteor.call('my-method', function (err, data) {  
   if (err) 
      console.log(err); 
   else 
      self.methodData.set(data);
 });

您可以使用

在助手中引用此功能

return Template.instance().methodData.get();

Meteor.call从集合中返回一些文档

2 个答案: