javascript - 我如何在 EmberJS 应用程序中使用 Jitsi Meet

Question

在我的 Ember 应用程序中，我使用我安装的 ember-inject-script:

npm install --save-dev ember-inject-script

我页面的 controller.js 文件如下所示:

import Ember from 'ember';
import injectScript from 'ember-inject-script';

export default Ember.Controller.extend({
  init: function() {
    this._super();
    var url = "https://meet.jit.si/external_api.js";
    injectScript(url);
    var domain = "meet.jit.si";
    var room = "JitsiMeetAPIExample";
    var width = 700;
    var height = 700;
    var htmlElement = document.querySelector('#meet');
    var api = new JitsiMeetExternalAPI(domain, room, width, height, 
              htmlElement);
  }
});

模板是这样的:

<h2>Jitsi Meet</h2>
<div id="meet"></div>
{{outlet}}

但是我得到一个控制台错误:

Error while processing route: projects.index JitsiMeetExternalAPI is not defined ReferenceError: JitsiMeetExternalAPI is not defined

Answer 1

• injectScript 是异步的，所以你不能在下一个语句中使用 JitsiMeetExternalAPI。您需要使用 then。

• 另一个问题是，您正在 Controller 初始化方法中访问 DOM 元素，该元素将不可用。通常 Controller 不了解 DOM。为此，我会鼓励您编写组件并使用 didInsertElement 钩子(Hook)

另一种在所需时间加载 js 的替代方法是在路由 beforeModel 钩子(Hook)中，您可以只使用 Ember.$.getJSON(url)。

beforeModel(){
 return Ember.$.getJSON(url);
}