angle：データベースから埋め込んだyoutubeビデオ

-1

私は、データベースからyoutubeビデオを埋め込んでいます。私はデータベースを使用せずに直接使用する場合、それは正常に動作しています。しかし、データベースからアクセスすると、私に以下のエラーが表示されます。angle：データベースから埋め込んだyoutubeビデオ

エラー：[$インジェクター：UNPR]？http://errors.angularjs.org/1.3.2/ $インジェクター/ UNPR P0 = youtubeEmbedUrlFilterProvider％20％3C-％20youtubeEmbedUrlFilter

私はSOで検索し、これと同じ一つの質問を見つけました。 how to embed video link from database in iframe using angularjs

しかし、同じ答えを使用している間、私はユーチューブの動画を再生することはできませんよ。実際にはビデオは表示されず、同じエラーが表示されています。 youtube video from db -

youtubevideo:"https://www.youtube.com/embed/c-z9M6KZs_0" 

<div ng-style="{'display':youtubevideo == ''?'none':'block'}"> 
              <iframe title="YouTube video player" 
class="YouTube-player" type="text/HTML" width="350" height="194" 
                ng-src="{{youtubevideo| youtubeEmbedUrl}}" frameborder="0" allowfullscreen></iframe></div> 

            <!-- Youtube Video Above -->

スクリプトファイルに以下のコードが追加されました。

ProfileApp.filter('youtubeEmbedUrl', function ($sce) { 
      return function(videoId) { 
      return $sce.trustAsResourceUrl('https://www.youtube.com/embed/' + videoId); 
      }; 
     });

私は間違っていることを教えてください。

出典

2017-08-19 Ironic

それが否決された理由は、任意のコメント？ – Ironic

console.clear(); 
 

 
var app = angular.module('myApp', []); 
 

 
app.config(function($sceDelegateProvider) { 
 
    $sceDelegateProvider.resourceUrlWhitelist([ 
 
    'self', 
 
    'https://www.youtube.com/**' 
 
    ]); 
 
}); 
 

 
app.controller('videoController', ['$scope', 
 
    function MyCtrl($scope) { 
 

 
    $scope.youtubevideo="https://www.youtube.com/embed/c-z9M6KZs_0"; 
 

 
    $scope.getIframeSrc = function(src) { 
 
     return src; 
 
    }; 
 
    } 
 
]);

<!DOCTYPE html> 
 
<html ng-app="myApp"> 
 

 
<head> 
 
    <script src="https://code.angularjs.org/1.2.1/angular.js"></script> 
 
    <link rel="stylesheet" href="style.css" /> 
 
    <script src="script.js"></script> 
 
</head> 
 

 
<body ng-controller="videoController"> 
 

 
    <div class="thumbnail"> 
 
    <div class="video-container"> 
 
     <iframe width="100%" ng-src="{{getIframeSrc(youtubevideo)}}" frameborder="0 " allowfullscreen></iframe> 
 
    </div> 
 
    </div> 
 

 
</body> 
 

 
</html>

出典

2017-08-19 03:48:07 Sajeetharan

あなたの答えに感謝します。今私はエラーの下になっています。未知のDOMException：原点が「https://www.youtube.com」のフレームがクロスオリジンフレームにアクセスできないようにブロックしました。（）：アプリケーションまたはデモの1：15 – Ironic

？ https://embed.plnkr.co/sfk1dElxyHPAltEp1voH/ – Sajeetharan

あなたのために働いたのですか？ – Sajeetharan

angle：データベースから埋め込んだyoutubeビデオ

答えて

関連する問題