【问题标题】:Odometer.js Does Not Work within Meteor?Odometer.js 在 Meteor 中不起作用?
【发布时间】:2015-02-11 00:00:29
【问题描述】:

我正在尝试使用 odometer.js 在我的 Meteor 模板中获取反应数字以进行动画处理。但似乎我无法超越第一步——让odometer javascript code 在 Meteor 中正常运行。当该代码执行时,它应该找到所有具有 .odometer 类的 DOM 元素,并根据您选择的样式表主题执行一些 DOM 元素操作,以便为动画数字操作准备 DOM。 Simple example here.

对于那些不熟悉该库的人,如果您在运行后检查 jsFiddle,您会明白我所说的 DOM 操作是什么意思。该脚本将简单的<div class="odometer"></div> 转换为嵌套层次结构:

样式表在 Meteor 中正确加载——如果我在 <head> 标记内四处寻找,我可以看到 application.css 内的类。但是脚本没有执行或没有正确执行,因为 DOM 永远不会更改为数字操作所需的特殊类层次结构。

  • 我尝试将脚本放入 client/script.js 文件中,但不成功。
  • 我尝试将脚本放在client/script.js 文件中,将其包装为全局函数名,然后从template.rendered 回调中调用该函数。不走运。
  • 我尝试将 odometer.js 代码直接嵌入到我的 template.rendered 回调中。不走运。

没有 JS 错误警告被打印到控制台。有没有人能让里程表在 Meteor 中工作?谢谢!

【问题讨论】:

  • 您能否为以前没有使用过这个库的人详细说明“DOM 永远不会更改为数字操作所需的特殊类层次结构”?你预计会发生什么?
  • @danyll 我添加了一些额外的细节,谢谢
  • 尝试将脚本放在/client/lib 目录中。需要先加载库才能使用它——我写了更多关于加载顺序的文章here

标签: javascript dom meteor


【解决方案1】:

如果您想使用任何库,您需要将脚本放在/client/lib 目录中,以便首先加载它。

但是,我为odometer 编写了一个名为d4nyll:odometeor 的包,它具有所有功能,并且允许您使用模板。可以在odometeor.meteor.com找到一个演示,它会每4秒随机更改一次数字。

使用方法:

  1. 运行meteor add d4nyll:odometeor
  2. 要么在模板中包含{{> odometeor 888}},要么使用Odometeor.create()
  3. 直接使用$('.odometeor').html([--YOUR-NEW-NUMBER]);更改值

Full documentation

【讨论】:

猜你喜欢
  • 1970-01-01
  • 2013-08-27
  • 1970-01-01
  • 1970-01-01
  • 2017-05-27
  • 2015-05-05
  • 2014-05-12
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多