Ember.js包括特定页面上的外部脚本 [英] Ember.js include external script on specific page

问题描述

我正在试图找出如何包含一个外部的JavaScript源代码（Exhibit），但只能在网站上的一个页面上。可以在视图或模板中完成吗？

I'm trying to figure out how to include an external javascript source (Exhibit), but only for a single page on the site. Can it be done in the view or template?

我发现只需添加< script src =exhibit.js>< / script> 到页面模板不起作用。如果我将整个网站的模板添加到整个网站的模板中，它会加载到每个页面上。

I found that simply adding <script src="exhibit.js"></script> to the page template doesn't work. If I add it to the template for the entire site it loads just fine, however it loads on every page.

我的问题的另一面可能更具体地展示。有没有办法每次加载页面时都会提供脚本？示例：当我第一次访问包含展示脚本的页面时，会加载包含展览的ember应用程序，并正确显示该页面。我离开页面，当我返回页面时，展示脚本没有被重新加载，因此不会像第一次访问页面那样正确地重绘页面。

The other side of my problem may be more specific to exhibit. Is there a way to have the script sourced every time the page is loaded? Example: When I first visit the page that contains the exhibit script, it loads the ember app including exhibit and the page is displayed properly. I navigate away from the page, when I return to the page the exhibit script is not reloaded, thus not redrawing the page properly as it did the first time it was visited.

推荐答案

如果您使用Ember CLI构建应用程序，而 exhibit.js 是一个相当小的文件，您可能会更好，包括 exhibit.js 在您的 vendor.js 文件中以最小化HTTP请求。

If you're building your app with Ember CLI and exhibit.js is a fairly small file you might be better off including exhibit.js in your vendor.js file to mininize HTTP requests.

但是，如果要在单个路径中加载 exhibit.js ，则可以使用这个答案像这样： p>

However, if you want to load exhibit.js in a single route your could use the polyfill method described in this answer like so:

// app/controllers/some-route-name.js    

import Ember from 'ember';

export default Ember.Controller.extend({

  loadPlugin: function() {
    // Use run loop if you need to setup the DOM first
    Ember.run.scheduleOnce('afterRender', this, function() {
      Ember.$.getScript('path/to/exhibit.js');
    });
  }.on('init')

});

这将异步加载文件。 getScript文档在这里 - 你会看到你也可以使用回调。

This will asynchronously load the file. The getScript docs are here - you'll see you can use callbacks too.

如果在加载之前不需要DOM设置，可以删除运行循环。在控制器的 init 事件上加载此脚本将阻止每次用户导航到路由时重新加载该脚本。如果您想要加载脚本，每次您可以将 getScript 移动到视图的 didInsertElement 事件。

If you don't need the DOM setup before loading, you can remove the run loop. Loading this script on the controller's init event will prevent it from reloading everytime the user navigates to the route. If you do want to load the script everytime you could move getScript to the view's didInsertElement event.

这篇关于Ember.js包括特定页面上的外部脚本的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！