I want to play a video with an angular expression with a YouTube video ID set in the frame tag.

Asked 2 years ago, Updated 2 years ago, 96 views

In the iframe tag, specify an angular expression with a YouTube video ID. I'd like to play a video, is it possible?

Currently, I didn't know how to specify the video ID directly, so
I have no choice but to use SelectBox.
(Select a video ID in SelectBox to play a video with the selected ID.)
 *See below

Would it be possible to play videos directly without using SelectBox?

I did a lot of research and tried, but it didn't work.
It would be very helpful if you could let me know.Thank you for your cooperation.

<!DOCTYPE HTML>
<htmlnd-app="myApp">
<head>
    <metacharset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scale=no">
    <meta http-equiv="Content-Security-Policy" content="default-src*data:;style-src*'unsafe-inline';script-src*'unsafe-inline'"unsafe-eval'">
    <script src="components/loader.js"></script>
    <link rel="stylesheet" href="components/loader.css">
    <link rel="stylesheet" href="css/style.css">

    <script>
        var app=ons.bootstrap("myApp", [ ])
          .config(function($sceDelegateProvider){
            $sceDelegateProvider.resourceUrlWhitelist([]
              'self',
              US>" https://www.youtube.com/embed/**'
            ]);
          });

        app.controller('TestController', function($scope,$sce){
            $scope.trustSrc=function(src){
                return$sce.trustAsResourceUrl('https://www.youtube.com/embed/'+src);
            };
        })
    </script>

</head>

<bodying-controller="TestController">

    <div>
        <iframe ng-src="{{trustSrc(url)}}">/iframe>
    </div>

    <div>
        <selectng-model="url">
          <option>{{■YouTube Video ID■}}</option>
        </select>
    </div>

</body>

</html>

javascript monaca onsen-ui angularjs html5

2022-09-30 21:21

1 Answers

I'm not sure if I can read the intent of the question, but is the behavior expected below?

<div>
  <iframe ng-src="{{youtubeUrl}}"></iframe>
</div>
app.controller('TestController',
['$scope', '$sce',
function($scope,$sce){
  variable = "YouTube Video ID"
  $scope.youtubeUrl=$sce.trustAsResourceUrl('https://www.youtube.com/embed/'+id);
}])


2022-09-30 21:21

If you have any answers or tips


© 2024 OneMinuteCode. All rights reserved.