导入在角2组件命名空间给了我一个构造错误
在角2组件导入命名空间给了我一个构造错误导入在角2组件命名空间给了我一个构造错误
ERROR Error: Uncaught (in promise): TypeError: YT.Player is not a constructor
TypeError: YT.Player is not a constructor
这里是我的角度成分的定义,这是引用该命名空间
我也尝试在我的组件中使用/// <reference path
,但这没有帮助。在铬/开发人员工具中,我收到错误。我能够做ng build
或ng serve
,并且它可以成功/成功地建立/服务。
import {
Component,
OnInit
} from '@angular/core';
@Component({
selector: 'app-video',
templateUrl: './video.component.html',
styleUrls: ['./video.component.css']
})
export class VideoComponent implements OnInit {
private id: string = 'qDuKsiwS5xw';
p: YT.Player;
done = false;
constructor() {
this.p = new YT.Player('player', {
height: 390,
width: 640,
videoId: 'M7lc1UVf-VE',
events: {
'onReady': this.onPlayerReady,
'onStateChange': this.onStateChange
}
});
}
ngOnInit() {
}
onStateChange(event) {
console.log('player state', event.data);
}
// 4. The API will call this function when the video player is ready.
onPlayerReady(event) {
event.target.playVideo();
}
// 5. The API calls this function when the player's state changes.
// The function indicates that when playing a video (state=1),
// the player should play for six seconds and then stop.
onPlayerStateChange(event) {
if (event.data == YT.PlayerState.PLAYING && !this.done) {
setTimeout(this.stopVideo, 6000);
this.done = true;
}
}
stopVideo() {
this.p.stopVideo();
}
}
下面是使用DefinitelyTyped
http://definitelytyped.org/docs/youtube--youtube/classes/yt.player.html
{
"extends": "../tsconfig.json",
"compilerOptions": {
"outDir": "../out-tsc/app",
"baseUrl": "./",
"module": "es2015",
"types": ["youtube"]
},
"exclude": [
"test.ts",
"**/*.spec.ts"
]
}
只需导入index.html的#script#标签中的外部库可以解决您的问题。
是的,我从那开始。我可能会切换到脚本版本,但我想知道如果使用Typescript版本,是否有解决此问题的方法。 –
你必须使用NG2 YouTube播放器,我tsconfig.app.json文件和I: https://www.npmjs.com/package/ng2-youtube-player
谢谢,这工作。 –
难道你不需要导入YT.Player?我一定会尝试找到一个有角度的YouTube播放器软件包来安装,以使生活更轻松。你有没有尝试https://github.com/orizens/ng2-youtube-player?我没有用过这个。但我总是试着做最小阻力的道路! – JGFMK