javascript - 当路由角度发生变化时，外部 js 库不起作用

Question

我在我的应用程序上使用外部库，我注意到当我更改路线然后返回库停止工作时。库是这样导入的：

   import videojs from "video.js"
   import  "videojs-markers"
    ....
   ngOnInit() {
      this.video = videojs('demo');
      this.video.on('pause', function () {
        this.onPauseVideo(this.video.currentTime())
      }.bind(this));
      this.video.on('play', function () {
        this.onPlayVideo(this.video.currentTime())
      }.bind(this));

      this.setUpMarkers(this.video);
        this.subscription = this.commentService.commentsChange.subscribe((newComments:VideoComment[])=>{
          this.video.markers.add(newComments.map(el=>{
            return {time:el.time,text:el.text,overlayText:el.overlayText}})
          );

        })
      }


     ....

有什么建议么。

标签： javascriptangularangular-ui-routervideo.js

Answer 1

1. 从您的代码中删除 .bind(this) 。箭头功能应该可以帮助您。
2. 此行移至 constructor(){}

   this.video = videojs('demo');

3. 删除所有像这样的事件监听器 ngOnDestroy(){ this.video.off('pause')