0
Angular JSのモーダルでJW Player 8を開いているときに問題が発生しています。playerInstance.setup値がJWPlayer 8で定義されていません。
Home.html
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.0/angular.min.js"></script>
<script src="https://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-2.5.0.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="../Scripts/AngularControllers/HomeController.js"></script>
<script src="../Scripts/Libraries/JWPlayer/jwplayer.js"></script>
<script>jwplayer.key = "XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX"</script>
<script src="../Scripts/AngularControllers/VideoController.js"></script>
</head>
<body ng-app="appHome">
<div ng-repeat="today in todayList">
<img ng-src="{{today.image}}" ng-click="showVideo(today.desc)">
</div>
</body>
</html>
HomeController.js
var homeApp = angular.module("appHome", ['ui.bootstrap']);
homeApp.controller("ctrlHome", ['$scope', '$uibModal', function ($scope, $uibModal) {
$scope.todayList = [
{ image: 'Images/hqdefault.jpg', name: 'ABC ABC ', desc: 'Here I Am ' },
{ image: 'Images/hqdefault.jpg', name: 'DEF', desc: 'I will Rock' }
];
$scope.showVideo = function (videoId) {
var modalInstance = $uibModal.open({
templateUrl: 'Video.html',
controller: 'ctrlVideo',
size: 'lg',
resolve: {
videoId: function() {
return videoId;
}
}
})
}
}]);
Video.html
<div id="myElement"></div>
VideoController.js
var myApp = angular.module('appHome');
myApp.controller("ctrlVideo", ['$scope', 'videoId', function ($scope, videoId) {
var playerInstance = jwplayer("myElement");
playerInstance.setup({
file: "FileName",
width: 640,
height: 360
});
}]);
私は、エラーの下に取得しています： -
TypeError: playerInstance.setup is not a function↵
さらなる分析後、私は内Video.htmlで述べた "<div id="myElement"></div>" Jwplayerを見つけることができないことがわかりましたVideoController.jsページ
エラーの解決にお役立てください。