通过模板访问流星收集

Accessing meteor collection through template

本文关键字:流星 访问      更新时间:2023-09-26

我试图访问一个模板上的流星集合的内容。第一步是搜索,允许应用程序从名为players的Mongo集合中显示特定项目,然后当你点击该项目时,它将带你到showPerson页面,该页面显示这些项目的内容。到目前为止,我已经能够让搜索工作,但是当你点击一个项目,它呈现新的页面,但不填充数据。

我试着通过这里的答案,但一直无法找出我做错了什么。

如果你注意到在<template name="search">中我有__originalId。我也尝试了_idid,但仍然没有成功。说到ID,这两者有什么区别?

和我的额外包

easy:search
aldeed:collection2
aldeed:autoform
kadira:flow-router
kadira:blaze-layout
arillo:flow-router-helpers

我还安装了自动发布和不安全,所以我猜这不是订阅问题??

免责声明—我是流星和javascript的新手,所以请随意将其拆开并握住我的手:)

我的html是

搜索选项
<template name="search">
  {{> EasySearch.Input index=playersIndex}}
  <ul>
    {{#EasySearch.Each index=playersIndex}}
      <li>Name of the player: <a href="{{pathFor 'showPerson'}}/{{__originalId}} ">{{name}}</a> {{name}}  Score of the Player:  ({{score}})</li>
    {{/EasySearch.Each}}
  </ul>
  {{> EasySearch.LoadMore index=playersIndex}}
  {{#EasySearch.IfNoResults index=playersIndex}}
    <div class="no-results">No results found!</div>
  {{/EasySearch.IfNoResults}}
</template>

显示内容的页面

<template name="showPerson">
  <h1>Show Person Details: {{name}}</h1>
  <div class="row">
 name: {{name}}
  </div>
  <div class="row">
    score: {{score}}
  </div>
  <div class="row">
    age: {{age}}
  </div>
</template>

My Javascript is

Tracker.autorun(function () {
  let cursor = PlayersIndex.search('Marie'); // search all docs that contain "Marie" in the name or score field
  console.log(cursor.fetch()); // log found documents with default search limit
  console.log(cursor.count()); // log count of all found documents
});

Template.search.helpers({
  playersIndex: () => PlayersIndex // instanceof EasySearch.Index  
  });

Template.update.helpers({
    exampleDoc: function () {
        return Players.findOne();
  }
});

Template.myMenu.helpers({
  items: function(){
    return MyCollection.find();
  }
});

Template.myMenu.events({
  'onChange #mySelect': function(ev){
    ...handle the event.
  }
});

和我的路线

FlowRouter.route('/', {
   action: function() {
    BlazeLayout.render("home");
   }
});

FlowRouter.route( '/players/:_id', {
  name: "showPerson",
  action: function( params ) {
    console.log( params._id );
    BlazeLayout.render( 'showPerson'); 
  }
});
FlowRouter.route('/hello', {
   action: function() {
    BlazeLayout.render('hello');
   }
});

如果有帮助的话,这里有两个截图

带搜索的主页

showPerson页面

数据库和模式

Players = new Mongo.Collection('players');
 PlayersSchema = new SimpleSchema({
    "name": {
    type: String,
    label: "Business Name"
  },
  "address": {
    type: String,
    label: "Address"
  },
  "website": {
    type: String,
    label: "Website",
    optional: true
  },
}
Players.attachSchema( PlayersSchema );

PlayersIndex = new EasySearch.Index({
  collection: Players,
  fields: ['name', 'score'],
  engine: new EasySearch.MongoDB ()
});

首先用{{#with}}包装showPerson模板

<template name="showPerson">
{{#with person}}
  <h1>Show Person Details: {{name}}</h1>
  <div class="row">
    name: {{name}}
  </div>
  //etc...
{{/with}}
</template>

然后添加一个帮助器来为{{#with}}提供数据:

Template.showPerson.helpers({
  person() {
    return Players.findOne(FlowRouter.getParam('_id'));
  }
});

你的showPerson模板没有显示任何数据,因为你没有给它任何数据。您应该从集合中获取与route/players/:_id

中给定的id匹配的球员数据。

>>

>