如何在 Angular 2 中集成 JWplayer

Posted 2023-02-22

【中文标题】如何在 Angular 2 中集成 JWplayer

【英文标题】：How to Integrate JWplayer in angular 2

【发布时间】：2018-09-12 14:37:57

【问题描述】：

我是 angular2 的新手。我想在我的应用程序中使用 jw player。我无法理解如何集成它。

【参考方案1】：

首先在.angular-cli.json中导入jwplayer.js

之后，您必须通过添加类型定义使其在 Angular 项目中可见：

declare var jwplayer: any;

您可以在组件 ts 文件或 typings.d.ts 文件中添加此类型定义。

然后像这样将div 添加到您的组件中：

<div id="myDiv">This text will be replaced with a player.</div>

然后在组件中添加代码，例如在ngOnInit 函数中：

jwplayer("myDiv").setup(
"file": "http://example.com/myVideo.mp4",
"image": "http://example.com/myImage.png",
"height": 360,
"width": 640
"key":"yourjwplayerkeyhere"

);

【讨论】：

"key":"yourjwplayerkeyhere" 不起作用。在这种情况下可以做什么？它对我有用的唯一方法是在 index.html 下添加 jwplayer.js 引用并在那里添加 jwplayer.key 。但这是一个安全风险。如何克服？