问题标签 [videogular2]

我videogular在我的 Angular 项目中使用库。我有这个错误Cannot read property 'elem' of undefined

我该如何解决？怎么了？

player.component.html

player.component.ts

我目前正在使用 Angular 项目，制作一个观看视频的网站。我使用 Videogular 是一个开发视频应用程序的框架。我不知道如何默认全屏制作视频。

我的代码：

非常感谢！

我正在开发一个新项目，我想在其中实现 Videogular2 播放器。视频文件是 DASH (.mpd) 文件。所以根据文档，我正在尝试实现 VgDASH 模块，但是我在运行它时遇到了问题。我是初学者，我会寻求帮助。

这是使用 dash 模块的官方示例：https ://github.com/videogular/videogular2-showroom/tree/master/src/app/streaming-player

在此基础上，我编写了我的应用程序。当我运行代码时，我在 Chrome 浏览器的控制台中收到以下错误：

PlayerComponent.html:61 错误类型错误：

和

core.js:6014 错误 MediaPlayer 未初始化！

这是我的组件（使用 Visual Studio Code 的代码中没有错误下划线）：

player.component.html

player.component.ts

有人可以建议我在哪里出错或在组件中发送一些正确的 vgDash 实现。（在顶部我在 github 上发布了我的项目的链接，如果有帮助的话）

videogular2 中播放器播放 mp4 文件的基本示例在我将其粘贴到 player.component.html时对我没有问题：

但我关心组件中的 DASH 支持而不是 html。

当我通过官方教程安装它时，我正在开发一个 angular 9 应用程序并在集成 videogular2 时遇到问题，一切都很好，直到我尝试为项目服务然后我得到这些错误

node_modules/videogular2/src/core/core.d.ts:29:22 中的错误 - 错误 NG6002：出现在 VideoPlayerModule 的 NgModule.imports 中，但无法解析为 NgModule 类

29 export declare class VgCoreModule { ~~~~~~~~~~~~ node_modules/videogular2/src/controls/controls.d.ts:1:22 - 错误NG6002：出现在VideoPlayerModule的NgModule.imports中，但可以不能解析为 NgModule 类

1 export declare class VgControlsModule { ~~~~~~~~~~~~~~~~ node_modules/videogular2/src/overlay-play/overlay-play.d.ts:1:22 - 错误NG6002：出现在VideoPlayerModule 的 NgModule.imports，但无法解析为 NgModule 类

1 export declare class VgOverlayPlayModule { ~~~~~~~~~~~~~~~~~~~ node_modules/videogular2/src/buffering/buffering.d.ts:1:22 - 错误NG6002：出现在NgModule VideoPlayerModule 的 .imports，但无法解析为 NgModule 类

1 导出声明类 VgBufferingModule { ~~~~~~~~~~~~~~~~~~ node_modules/videogular2/src/streaming/streaming.d.ts:6:22 - 错误 NG6002：出现在 NgModule.imports VideoPlayerModule，但无法解析为 NgModule 类

6 export declare class VgStreamingModule { ~~~~~~~~~~~~~~~~~ src/app/apps/video-player/video-player.module.ts:42:14 - 错误NG6002：出现在AppsModule 的 NgModule.imports，但本身有错误

42 导出类 VideoPlayerModule ~~~~~~~~~~~~~~~~~ src/app/apps/apps.module.ts:29:14 - 错误NG6002：出现在AppModule的NgModule.imports中，但是本身有错误

29 导出类AppsModule ~~~~~~~~~~

** Angular Live Development Server 正在监听 localhost:7777，在http://localhost:7777/上打开浏览器**

这是我的 package.json 文件

}

这是我的模块

我正在尝试为我的视频幻灯片重现 TikTok 行为。我正在使用 ionic-slides，它使用引擎盖下的 swiper 库和 videogular2 库来控制视频。

所以，现在，我有一个带有 3 个幻灯片的滑块。每张幻灯片都包含一个视频组件。我需要的是在准备好时自动播放第一个视频，然后在幻灯片上播放下一个视频更改并停止上一张幻灯片中的视频。

在我的feed.component.html我有下一个标记

在我的feed.component.ts

app-vide-player.component.html包含

并app-vide-player.component.ts包含

我应该如何连接视频播放器组件和他的父提要页面组件来处理更改事件并播放/暂停所需的视频？我应该通过服务还是...？有什么想法/建议吗？

我想使用视频播放器videogular2，并使用以下命令安装此播放器：

npm install videogular2

npm install @types/core-js

我想导入模块：

但它找不到这个模块的这个导入。

找不到模块“videogular2/core”或其相应的类型声明。

找不到模块“videogular2/controls”或其相应的类型声明。

找不到模块“videogular2/overlay-play”或其相应的类型声明。

找不到模块“videogular2/buffering”或其相应的类型声明。

我怎么解决这个问题 ？？？？

我使用 videogular2 开发了一个私人项目，它适用于带有 mp4、ogg、webm 扩展的视频。但是 videogular2 不支持具有 mov、avi 和 wmv 扩展名的视频，并且这些视频以禁用状态显示。

任何带有 Stackblitz 项目链接的解决方案都将受到高度赞赏。谢谢。

我正在使用@videogular/ngx-videogular 播放视频，我想标记其中 80% 播放的视频

注意：我已经找到了 media.duration 但它没有帮助。

额外的问题：有没有办法知道视频的持续时间，比如制作一个影子搜索栏来知道它已经看过多少？

角度版本 13，和“@videogular/ngx-videogular”：“^5.0.1”，

videoPlayer.component.html

videoPlayer.component.ts

这是我的视频列表

我最近将项目的 Angular 版本从 9 升级到了 13。由于此版本不再支持 videogular2 包，我将应用程序迁移到使用 @videogular/ngx-videogular 并完全按照 github 页面上提到的迁移过程进行。

迁移后，我的“播放视频”按钮和全屏、视频滚动等控件都不见了。这是由于 DOM 上没有类。我比较了更改之前的其他环境，DOM 看起来有点不同。它在 DOM 上根本没有“vg-icon-play_arrow”。这就是它的样子——

我们正在维护本地 videogular.css，我看到它已经在 style.scss 中导入，在 Angular.json 中正确提及。我不是前端专家，不知道如何找出为什么这是类“vg-icon-play_arrow”并且“div”元素“overlay-play-container”上缺少 flex

关于如何找到问题所在的任何建议？或者什么可能是解决方案？

这是 DOM 的外观

注意：我已经尝试使用 @videogular/ngx-videogular 推荐的 node_modules css，直接在 Angular.json 中使用而不是项目 videogular.css，但它给出了相同的结果。根据推荐，所有字体文件都是最新的