我如何在 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.
另一个问题是，您正在控制器初始化方法中访问 DOM 元素，该元素将不可用。通常控制器不会 DOM 知道。为此，我会鼓励您编写组件并使用 didInsertElement hook

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

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

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

How do I use Jitsi Meet in an EmberJS app

javascript

node.js

ember.js