繁体   English   中英

在ember.js应用程序中处理JavaScript脚本标记小部件

[英]Handling JavaScript script-tag widgets within ember.js applications

ember.js应用程序中的车把模板在“ script”标签内。 第三方窗口小部件,广告以及通常不是另一个“脚本”,用于在其插入位置进行文档编写。

带有script标签的脚本将不起作用,那么是否有办法在余烬应用程序中进行处理?

为了编写可维护的DRY代码,应使用ember-clibrunch之类的构建工具来构建任何实际大小或重要性的Ember应用程序。 这些构建工具将从多个目录编译应用程序文件(包括模板和供应商文件)。 我将介绍这些内容,然后再介绍几种无需构建工具即可包含小部件/脚本的方法。

1)尽管《 Ember Guides》向您展示了如何使用script标签定义模板,但这不是管理应用程序模板的有效方法(除非您出于需要而构建应用程序或JSbin演示等)将所有内容都放在一个文件中)。 像上面提到的那些构建工具使用解析器来监视您的文件目录,并将模板编译为Ember.TEMPLATES对象,您的应用程序无论如何都可以从中访问它们。

这些构建工具通常具有单独的目录,您可以在其中放置供应商文件(例如,第三方小部件),这些目录通常会被监视是否有更改,并被编译到index.html页面中包含的vendor.js文件中。 您还可以使用NPM和Bower等依赖项管理工具来简化此过程。 在这两种情况下,都可以在整个应用程序中访问插件方法。

2)如果您确实不想使用构建工具,则只需在结束body标记之前在index.html页面上包含script标记即可,并且可以在应用程序内的window对象上访问任何方法。 如果您要在页面上的特定位置尝试放置诸如社交共享按钮之类的小部件,则此方法显然无效。

3)当您不使用构建工具时,另一种方法是在didInsertElement事件的视图或组件内运行$.getScript()方法( 请参见此处 )。 这可能是在模板的特定位置包含类似小部件的脚本的最佳方法。 视图内,您可以使用this.$().find('.some-selector')为目标的模板内的特定元素或this.$()为目标的视图的元素本身。

更多信息:

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM