8

我试图制作一个搜索框来过滤我在客户端返回的集合的结果。

但是,当我实际尝试搜索时,我在控制台中收到了上述错误。

RangeError: Maximum call stack size exceeded.

这是我的代码。

<body>
{{#isolate}}
 <header class="row-fluid">
  {{> modules}}
 </header>
{{/isolate}}

<div id="main" class="span11">
 {{#if currentUser}}

 {{#isolate}}
  {{> customers_list}}
 {{/isolate}}   

 {{#isolate}}
  {{> contacts_list}}
 {{/isolate}}

 {{/if}}
</div>
</body>

我在模块模板中的搜索表单

<template name="modules">
 {{templateLogger "modules"}}
  <ul id="module_list" class="nav">
 {{#each list}}
  <li>
   <a href="#" id="module_{{_id}}" module_id="{{_id}}" class="module">{{name}}</a>
  </li>
 {{/each}}
  <form><input type="text" id="search"></form>
</ul>

和我正在尝试过滤结果的 customers_list 模板

<template name="customers_list">
 <table class="table">
  <tr>
   <th>Name</th>
   <th>Address</th>
   <th>City</th>
   <th>State</th>
   <th>Zip</th>
   <th>Phone</th>
  </tr>

 {{#each record}}
  <tr>
   <td>{{name}}</td>
   <td>{{address}}</td>
   <td>{{city}}</td>
   <td>{{state}}</td>
   <td>{{zip}}</td>
   <td>{{phone}}</td>
  </tr>
 {{/each}}
 </table>
</template>

这是搜索表单的事件处理程序

Template.modules.events({
 'keypress input#search': function (event) {
  Session.set("currentFilter", $('input#search'));
 }
});

表单助手会显示结果

Template.customers_list.record = function() {
 qry = Session.get("currentFilter") || "";
 if (qry != "") {
  return Customers.find({$or: [ {'name': qry}, {'address': qry}, {'city': qry}, {'state': qry} ] });
 } else {
  return Customers.find({competitor: null}, {sort: {name: 1}});
 };
}

我不知道是什么导致了这个错误,从我在其他 SO 帖子上看到的关于这个错误的信息看起来像是一个无限循环,但是这些不是流星特定的问题,我不知道这是否会有所作为? 如果有一个无限循环,我也找不到它。

任何帮助将不胜感激。

4

2 回答 2

18

当您将大对象作为参数传递给您的方法时,会发生此错误。例如,对我来说,我第一次遇到这个错误是当我将 aMeteor.Collection作为参数传递时 :s 。我通过将集合名称作为字符串传递,然后eval()在方法中使用来获取继续进行的集合,从而解决了这个问题。

结论:始终使用字符串、整数、小数组或非常小的对象作为从事件处理程序调用的方法的参数。

于 2013-09-09T04:28:59.367 回答
6

改变这个:

Template.modules.events({
 'keypress input#search': function (event) {
  Session.set("currentFilter", $('input#search'));
 }
});

对此:

Template.modules.events({
 'keyup input#search': function (event) {
  Session.set("currentFilter", $('input#search').val());
 }
});

我相信您只需要输入字段的 jquery dom 引用上的 .val() 。此外,我建议对此类事件使用 keyup 。

为了得到你想要的结果,你可能想要使用正则表达式。这是我在我的应用程序中使用的。

Template.hudlies.found = function() {
  var searchVal = Session.get("searchFilter");
    if (searchVal != "") {
      var searchResults = Hudlies.find({ name: { $regex: '^.*' + searchVal + '.*', $options: 'i' } });
    };

  return searchResults;
};
于 2013-06-26T05:55:09.900 回答