Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/378.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181

Warning: file_get_contents(/data/phpspider/zhask/data//catemap/1/angular/33.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 如何访问angular 2中VideoJs函数中的成员变量和方法?_Javascript_Angular_Typescript_Video.js - Fatal编程技术网

Javascript 如何访问angular 2中VideoJs函数中的成员变量和方法?

Javascript 如何访问angular 2中VideoJs函数中的成员变量和方法?,javascript,angular,typescript,video.js,Javascript,Angular,Typescript,Video.js,我在我的angular项目中使用videojs插件。我试图访问videojs方法中的值和方法,但它在组件初始化时显示未定义的值。我也尝试在ngAfterViewInit中调用videojs方法,但它仍然没有在videojs方法中显示组件的值。如何在videojs方法中显示变量值?有人能帮我吗 组件代码: import {Component,OnInit} from '@angular/core'; declare var videojs :any; @Component({ selecto

我在我的angular项目中使用videojs插件。我试图访问videojs方法中的值和方法,但它在组件初始化时显示未定义的值。我也尝试在ngAfterViewInit中调用videojs方法,但它仍然没有在videojs方法中显示组件的值。如何在videojs方法中显示变量值?有人能帮我吗

组件代码:

import {Component,OnInit} from '@angular/core';
declare var videojs :any;

@Component({
  selector: 'app-play-video',
  templateUrl: './play-video.component.html',
  styleUrls : [] 
 })
export class PlayVideoComponent implements OnInit{
public videoJSplayer :any;
public videoUrl :string;

constructor(){
this.videoUrl = 'http://clips.vorwaerts-gmbh.de/VfE_html5.mp4';
}
showValues(){
console.log("show Values method called"); 
}
  ngOnInit() {
    this.videoJSplayer = videojs(document.getElementById('play_video_id'), {}, function() { 
          console.log(this.videoUrl);  // here the video url value is undefined
          this.showValues(); // this also undefined
          this.play();
          }
    }
  }
play-video.component.html:

<video id="play_video_id" class="video-js vjs-default-skin vjs-big-play-centered"
  controls preload="auto" width="640" height="264"
  poster="http://video-js.zencoder.com/oceans-clip.png"
  data-setup='{"example_option":true}'>
  <source [src] = videoUrl  type="video/mp4" />
</video>
您必须使用ES6进行回调,才能在回调中获得正确的上下文。当您使用函数{}语法时,此内部将根据调用上下文的不同而变化:

this.videoJSplayer = videojs(document.getElementById('play_video_id'), {}, () => { 
          // `this` will point to the current `PlayVideoComponent` instance
     }
)

感谢Saravana,我遵循了箭头函数,现在我可以访问这些值了!