如何在Angular中添加Swarmify Video Player插件JS文件?

时间:2019-03-12 12:42:57

标签: javascript angular web-applications angular-cli video.js

我正在开发Angular Web App。

我正在使用Swarmify Web Player播放视频

但是他们提供了一个JS文件,该文件必须包含在Script标记中,如下所示:

 inner class OnMarkerClickRateLimitedDecorator(private val onMarkerClickedListener: OnMarkerClickListener, private val delay: Long) : OnMarkerClickListener {
        override fun onMarkerClick(marker: Marker?): Boolean {
            googleMap.uiSettings.isScrollGesturesEnabled = false
                googleMap.uiSettings.isZoomGesturesEnabled = false //these uiSettings aren't even what im looking for , i just want to disable markers but no api is available for that, so tried it that way
            val isConsumed = onMarkerClickedListener.onMarkerClick(marker)
            Handler().postDelayed({ 
                googleMap.uiSettings.isScrollGesturesEnabled = true
                googleMap.uiSettings.isZoomGesturesEnabled = true

             }, delay)
            return isConsumed
        }
    }

Is there a way i can do this with RxJava. 

播放视频

<script data-cfasync="false">
    var swarmoptions = {
        swarmcdnkey: "f4d864ed-5671-486f-b371-1b5cb3336170",
        autoreplace: {
            youtube: false
        }
    };
</script>
<script data-cfasync="false" src="https://assets.swarmcdn.com/cross/swarmdetect.js"></script>

但是我不知道如何添加此JS类型的插件

我所做的步骤

我在应用程序的index.html页面中添加了此脚本标签

此后,我在Video-Page.Component.html ..中添加了 <smartvideo style="min-width: 100%; min-height: 100%;" src="http://www.example.com/sample.mp4" width="600" height="600" controls></smartvideo> ,出现以下错误:

SmartVideo tag

所以我使用了另一种方法:

我在Swarmify - swarmdetect.js: Document Write Succeeded swarmdetect.js:1:553 Error: Template parse errors: 'smartvideo' is not a known element: 1. If 'smartvideo' is an Angular component, then verify that it is part of this module. 2. To allow any element add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component. (" <div class="single-video"> [ERROR ->]<smartvideo src="https://videos.fetnation.com/file/videostream/5c4c5774450d2923589c09a6_The Dark Kn"): ng:///AppModule/VideoPageComponent.html@18:10

中添加了这些行
videopage.component.ts

但是我仍然遇到上述错误,即未定义smartvideo标记

我也没有在ngOnInit() { let s2 = this._renderer2.createElement('script'); s2.type = 'text/javascript'; s2.src = 'https://assets.swarmcdn.com/cross/swarmdetect.js'; this._renderer2.appendChild(this._document.body, s2); } ngAfterViewInit () { let s = this._renderer2.createElement('script'); s.type = 'text/javascript'; s.text = ` var swarmoptions = { swarmcdnkey: "f4d864ed-5670-486f-b371-1b5cb3336170", autoreplace: { youtube: false } };`; } 中添加任何错误模式,但问题仍然存在

Video-page.component.ts

请帮助我

1 个答案:

答案 0 :(得分:0)

您现在可以将 smartvideo 添加到 class 中以使用 Swarmify

<smartvideo class="smartvideo" style="min-width: 100%; min-height: 100%;" src="http://www.example.com/sample.mp4" width="600" height="600" controls></smartvideo>

前几年:
https://support.swarmify.com/hc/en-us/articles/360057623814-Using-a-standard-HTML-Video-tag-with-SmartVideo