• meteor实例—4—(helper等)


    上面的一些{{}}标记,其中的数据来龙去脉基本已经清楚了,但是还有一个{{domain}}没有提到,就是post_item.html中的<h3><a href="{{url}}">{{title}}</a><span>{{domain}}</span></h3>这一句,这个东西是干什么用的呢,查看一下客户端源代码,会发现<span>和</span>中间是空的,就算删除了{{domain}}也对展示毫无影响,那么{{domain}}是干什么的,其实domain应该是post_item helper的一个属性或者方法,官方给出的例子是这样的:

    我们现在在client emplateposts下创建一个post_item.js 文件来包含postItem 模板的逻辑:

    Template.postItem.helpers({
    domain: function() {
    var a = document.createElement('a');
    a.href = this.url;
    return a.hostname;
    }
    });
    View Code

    其实我在测试的时候没有用var,用的typescript的let,即 let a = document.createElement('a'); typescript是微软推出的一个高阶javascript,对于习惯于面向对象编程的人来说,typescript绝对是个好的选择,特别是对于类的处理,使用起来会非常顺手。

    这一次我们domain helper 的值不再是一个数组,而是一个匿名函数。相比起我们之前简化的虚拟数据的例子,这种模式更为常见(而且更有用)。

    该部分代码的功能是根据当前列表项的url生成一个变量a,并返回其域名。

    但是它一开始是从哪里获得 URL 地址呢?
    为了回答这个问题,我们需要回到我们的posts_list.html 模板。{{#each}} 代码块不仅遍历我们数组,它还在代码块范围内将 this 的值赋予被遍历的对象。
    这意味着在{{#each}} 标记之间,每个 post 都可以通过this 依次访问,并且一直延伸到模板 helper( post_item.js )中。

  • 相关阅读:
    静态网页
    css
    html
    数据分析器
    初步了解计算机
    如何导出数据库的数据词典
    阅读计划
    python之文件读写
    曾梦想仗剑走天涯,看世界的繁华
    python lambda匿名函数
  • 原文地址:https://www.cnblogs.com/wonderhow2/p/6344992.html
Copyright © 2020-2023  润新知