iframe src от angularjs не работает - PullRequest
0 голосов
/ 19 мая 2018

Я пытаюсь получить ссылку на YouTube из MySQL, используя php, и вставить ее на веб-страницу с angularjs.Проблема в том, что все остальные данные отображаются на веб-странице, кроме iframe.Как вы можете видеть в представлении моего кода ниже, что я отобразил post.src на веб-странице.Ссылка именно то, что я ожидал.Тем не менее, когда я пытаюсь внедрить его и попытаться передать ссылку, используя {{post.src}} в источнике iframe, он ничего не показывает, но занимает некоторое место, как было указано в инструкциях по ширине и высоте iframe.

Есть мысли ???

<!-- HTML content -->
<body ng-app="myApp">
<div ng-controller="videoControl">
    <table>
      <tr ng-repeat="post in posts">
        <td>{{ post.postType }}</td>
        <td>{{ post.postTitle }}</td>
        <td>{{ post.postDescription }}</td>
        <td>{{ post.postDate }}</td>
        <td>{{ post.src }} </td>
        <td>
            <iframe width='560' height='315' ng-src='{{ post.src }}' frameborder='0' allow='autoplay; encrypted-media' allowfullscreen></iframe>
        </td>
      </tr>
    </table>
</div>







<!-- module -->
var app = angular.module("myApp", ["ngRoute"]);






<!-- controller -->
app.controller('videoControl', function($scope, $http) {
    $http.get("pages/db_section/videos.php")
    .then(function (response) {
        $scope.posts = response.data.records;
    });
});






<!-- videos.php -->
<?php

include 'db.php';

connection();

$sql = "SELECT * FROM feed WHERE post_type='video' ORDER BY time DESC";
$result = $conn->query($sql);

$outp = "";
while($rs = $result->fetch_array(MYSQLI_ASSOC)) {
    if ($outp != "") {$outp .= ",";}

    $source = str_replace("watch?v=","embed/",$rs["src"]);

    $outp .= '{"postType":"'  . $rs["post_type"] . '",';
    $outp .= '"postDate":"'   . $rs["time"]        . '",';
    $outp .= '"postTitle":"'   . $rs["post_title"]        . '",';
    $outp .= '"src":"'   . $source      . '",';
    $outp .= '"postDescription":"'. $rs["post_description"]     . '"}';
}
$outp ='{"records":['.$outp.']}';


connectionClose();

echo($outp);

?>

1 Ответ

0 голосов
/ 19 мая 2018

Вам необходимо использовать фильтр, где 'post.src' - это URL-адрес iframe, а 'trustAsResourceUrl' - это фильтр, который определен

angular.module('myApp', [])
.filter('trustAsResourceUrl', ['$sce', function($sce) {
    return function(val) {
        return $sce.trustAsResourceUrl(val);
    };
}])

и HTML

 <iframe width='560' height='315' ng-src='{{ post.src | trustAsResourceUrl}}' frameborder='0' allow='autoplay; encrypted-media' allowfullscreen></iframe>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...