Warning: file_get_contents(/data/phpspider/zhask/data//catemap/8/meteor/3.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Meteor 如何明确数据上下文?_Meteor - Fatal编程技术网

Meteor 如何明确数据上下文?

Meteor 如何明确数据上下文?,meteor,Meteor,这里的初学者问题:我正在完成。模板的这一行使我暂停: <h3><a href="{{url}}">{{title}}</a><span>{{domain}}</span></h3> 我不明白为什么这不起作用。我理解这可能会使代码更加冗长,但就我个人而言,我更希望代码更加明确,而不是模棱两可 谢谢你的帮助 你对发生的事情的描述有点不对劲。让我试着澄清发生了什么事 这两个模板是: <template name="post

这里的初学者问题:我正在完成。模板的这一行使我暂停:

<h3><a href="{{url}}">{{title}}</a><span>{{domain}}</span></h3>
我不明白为什么这不起作用。我理解这可能会使代码更加冗长,但就我个人而言,我更希望代码更加明确,而不是模棱两可


谢谢你的帮助

你对发生的事情的描述有点不对劲。让我试着澄清发生了什么事

这两个模板是:

<template name="postsList">
  <div class="posts">
    {{#each posts}}
      {{> postItem}}
    {{/each}}
  </div>
</template>

<template name="postItem">
  <div class="post">
    <div class="post-content">
      <h3><a href="{{url}}">{{title}}</a><span>{{domain}}</span></h3>
    </div>
  </div>
</template>

{{{#每个帖子}
{{>positem}
{{/每个}}
{{domain}}
  • postList
    模板包括一个迭代器
    {{{each posts}}
  • 此迭代器从
    positem
    模板的
    posts
    助手获取其数据
  • 助手返回一个游标,该游标是对集合执行
    find()
    的结果。或者,该助手可以返回一个对象数组
  • 游标是被动的,这意味着可以随时添加、删除或更改项,而无需编写代码来更新DOM。魔法
  • 迭代器中包含
    positem
    模板
  • 对于迭代器的每次迭代,都会创建一个数据上下文,它是一个单独的对象
  • 在javascript中,当前数据上下文将位于
    this
  • 在空格键中,您可以访问对象中的任何字段,只需将该字段的名称放在双大括号中,例如:
    {{title}
  • 如果您想更明确一些,还可以使用
    {{{this.title}}
  • 有时,对象没有您需要显示的所有数据。您可能需要重新格式化现有字段,以某种方式组合它们,将它们转换(例如:UTC到本地时间,$到英镑等),或者从不同的集合中查找相关数据。在这些情况下,您需要一个助手来返回额外的数据

    以显示的方式直接在助手中操作DOM是不明智的。由于即使使用相同的数据上下文,也可以重复调用helpers,因此最终可能会得到比预期多得多的
    a
    元素


    实际上,来自当前数据上下文的字段值和辅助值之间的区别对于表示层来说并不重要。这并不是妨碍你在Meteor中发展的东西。出现的常见情况是,在标记中插入
    {{{mything}
    ,但忘记为其定义帮助器,然后显示为空白。或者您认为您的对象有一个它没有的密钥,您也会得到一个空白。

    这是我使用Meteor中的Blaze明确数据上下文的首选方法

    您可以在此处看到一个工作示例:

    我为每个子模板提供一个明确的参数列表,如下所示:

    {{> player name=this.name score=this.score}}
    
    在本例中,每个列表项只需显示用户名及其分数。因此,子模板只获取两个变量作为其数据上下文、名称和分数,而不获取任何其他变量。
    这有助于我调试问题并准确定义模板需要哪些字段

    //   Parent Template
    Template.leaderboard.helpers({
      players: function () {
        return Players.find({}, { sort: { score: -1, name: 1 } });
      }
    });
    
    <template name="leaderboard">
      {{#each players}}
        {{> player name=this.name score=this.score}}
      {{/each}}
    </template>
    
    
    //   Child Template
    <template name="player">
      <div>{{userName}} : {{userScore}}</div>
    </template>
    
    Template.player.helpers({
      userName: function() {
        return this.name;
      },
      userScore: function(){
        return this.score;
      }
    });
    
    //父模板
    Template.Leadboard.helpers({
    玩家:功能(){
    返回玩家。查找({},{sort:{score:-1,name:1});
    }
    });
    {{{#每个玩家}
    {{>player name=this.name score=this.score}
    {{/每个}}
    //子模板
    {{userName}}:{{userScore}
    Template.player.helpers({
    用户名:function(){
    返回此.name;
    },
    userScore:function(){
    返回此.score;
    }
    });
    
    在模板内部,如果数据上下文字段不可用或类型错误,也可以抛出错误


    当我开始使用Meteor时,我有一个非常相同的问题,对于我来说,有这种隐含数据上下文的想法似乎很尴尬。

    对每个人来说都是自己的,但这感觉像是太多的开销,失去了blaze的简单优雅!尤其是一路上更改字段名。是的,我同意这有点冗长。对我来说,它有助于调试东西。因此,出于好奇,为什么需要从函数返回
    this.name
    ?为什么
    userName:this.name
    不起作用?@DarielDato on我不知道。我的猜测是,在像这样的helper声明中,username:this.name指的是helper块本身,而不是您所期望的有意义的数据上下文。helper函数中的“this”被设置为模板数据上下文的原因是幕后Meteor可能正在使用javascript的function.call()或function.apply调用helper。call()和apply()可以设置函数中的“this”。谢谢!这种解释确实有助于澄清问题。我想这只是一种不同的思考方式,因为正如您所说,视图层不区分数据上下文和辅助值。但是,如果您创建了一个覆盖数据上下文的帮助器,这不会导致问题吗?例如,如果您还有一个名为
    title
    的帮助程序,则不清楚
    {{title}}
    是否引用了帮助程序或数据上下文。我不确定,但我希望字段优先于同名的帮助程序。
    //   Parent Template
    Template.leaderboard.helpers({
      players: function () {
        return Players.find({}, { sort: { score: -1, name: 1 } });
      }
    });
    
    <template name="leaderboard">
      {{#each players}}
        {{> player name=this.name score=this.score}}
      {{/each}}
    </template>
    
    
    //   Child Template
    <template name="player">
      <div>{{userName}} : {{userScore}}</div>
    </template>
    
    Template.player.helpers({
      userName: function() {
        return this.name;
      },
      userScore: function(){
        return this.score;
      }
    });