Question

大家好，非常感谢你的帮助。根据评论中的建议编辑问题。

我是Mongo和Meteor的新手。

我有一个收集＆＃34;帖子＆＃34;有一个字段＆＃34; slug＆＃34;。

＆＃34;帖子＆＃34;模板正确填充每个帖子的值。 Slug值总是类似于＆＃34; my-great-post＆＃34;。

我需要获取_id的slug的文本值，每次访问模板时，它都会有所不同，编码，写一个字符串，然后将字符串吐回到模板中。

尝试过的事情

无法返回＆＃34; this.slug＆＃34;的值或＆＃34; this.data.slug＆＃34;在模板助手或onRendered中，即使已定义集合并在模板中正确填充空格键值
＆＃34;这＆＃34;返回＆＃34; [object Object]＆＃34;到console.log
应用程序崩溃，可能我不完全理解文档中的帮助语法

（我在评论中遵循了建议，以避免尝试在模板html中创建脚本，因此下面是帮助这个帖子的每个人都要求的更多信息）

- 模板html -

{{#with post}}

<div class="blog-article">
  <div class="blog-header">
    <div class="left">

      <!-- title -->
      <h1 class="post-title">{{title}}</h1>

      <div class="holder">
        <div class="post-tags">
          <!-- tags -->
           {{#each tags}}
              <span>{{this}}</span>
           {{/each}}
        </div>
      </div>

    </div>

  </div> 

  <div class="blog-post">
    <div class="blog-copy">

      <!-- date -->
      <div class="post-date">{{post_date}}</div>

      <!-- social -->  
      <div class="blog-social">
         <!-- 
               <a class="so-facebook" target="_blank" href="need to encode slug here"></a>
         -->       
       </div>

       <!-- ============== post ============== -->

       {{{content}}}

       <!-- ============ end post ============ -->

     </div>
  </div>
</div>

{{/with}}

- 模板js -

Template.post.onCreated(function() {
  var self = this;
  self.autorun(function() {
    var postSlug = FlowRouter.getParam('postSlug');
    self.subscribe('singlePost', postSlug);  
  });
});

Template.post.helpers({

  post: function() {
    var postSlug = FlowRouter.getParam('postSlug');
    var post = Posts.findOne({slug: postSlug}) || {};
    return post;
  } 

   // can't get these working in a helper, out of helper they crash the app 
   // console.log(this.slug);   
   // console.log(this.data.slug);

});

Template.post.onRendered( function () {

   // these do not work 
   // console.log(this.slug);   
   // console.log(this.data.slug);

});

db.posts.findOne（）;

{
  "_id" : ObjectId("576c95708056bea3bc25a91f"),
  "title" : "How Meteor Raised the Bar For New Rapid-Development Technologies",
  "post_date" : "May 28, 2016",
  "image" : "meteor-raised-the-bar.png",
  "slug" : "how-meteor-raised-the-bar",
  "bitlink" : "ufw-29Z9h7s",
  "tags" : [
    "Tools",
    "Technologies"
           ],
  "excerpt" : "sizzling excerpt",
  "content" : "bunch of post content html"
}

如果有人能用任何方法解决这个问题，我会以最强烈的喜悦和感激接受答案。

Answer 1

问题可能在于父模板，而不是这个模板。 Meteor的工作方式是将JS文件与HTML分开，因此不要试图在HTML中包含<script>标记。

首先，您必须将所有文档加载到客户端。（注意：一旦你掌握了它，那么你可以担心只加载你需要的文件。）

要做到这一点，您需要一个集合和一个出版物。默认情况下，所有集合都会自动完全发布，因此除非您删除了自动发布的模块，否则我会假设它仍然被加载。

所以让我们从父模板开始吧。在这种情况下，我将循环遍历集合中的所有帖子并使用innerTemplate显示它们。

<template name=parent>
  <ul>
  {{#each post}}
    {{> innerTemplate}}
  {{/each}}
  </ul>
</template>

现在我们的内部模板可能如下所示：

<template name=innerTemplate>
  <li>{{slug}}</li>
</template>

最终结果将是每个slug的简单列表。

现在，要将所有内容链接在一起，我们需要创建一个JS文件，它将： 1.在客户端和服务器上定义集合 2.将集合传递给父模板

客户端和服务器都应该可以访问此文件。

posts = new Mongo.Collection('posts');

if(Meteor.isClient) {
  Template.parent.helpers({
    posts() {
      return Posts.find();
    }
  });
}

现在，如果你想在JS文件中使用'slug'做一些事情，你可以这样做：

if(Meteor.isClient) {
  Template.innerTemplate.helpers({
    upperCaseSlug() {
      return this.slug.toUpperCase();
    }
  });
}

然后，您可以在模板中引用upperCaseSlug，如下所示：

<template name=innerTemplate>
  <li>{{upperCaseSlug}}</li>
</template>

Answer 2

关于流星的一些事情：

你永远不应该看到如下的模式：

<script type="text/javascript">
...some code
</script>

因为Meteor将所有你的js文件合并到一个大文件中，并自动将其包含在你的应用中。您永远不必以这种方式声明自己的脚本。

其次，您永远不必通过读取DOM来获取数据对象的值。每个模板的数据上下文为您提供变量this中的数据。

在帮助者或模板事件中，您可以参考this并确保您准确获取该模板实例中显示的数据。

现在已经看到了您的模板代码，现在很明显您的模板没有数据上下文 - 您在{{#with post}}及其关联的帮助程序中设置了数据上下文，但这并没有最终创建this你需要一个级别。

所以... @Nathan在正确的轨道上，除了他假设你正在迭代光标而不是只看一个帖子。

获取{{#with post}}和{{/with}}之间的所有HTML，并将其放入新模板中，说postDetail然后制作外部模板：

<template name="post">
{{#with post}}
  {{> postDetail}}
{{/with}}
</template>

现在，您的postDetail模板将自动获得与post对象相等的数据上下文，您的助手可以安全地引用this。

Template.postDetail.helper({
  slugURI{
    return "/"+encodeURI(this.slug);
  }
});

然后在您的postDetail模板中，您可以获得编码的slug：

<a class="so-facebook" target="_blank" href={{slugURI}}>

javascript获取已经渲染的Mongo字段的值 - Meteor

2 个答案: