Comment faire confiance et définir l'attribut iFrame Src à partir d'une variable dans AngularJS ?

Définition de l'attribut iFrame Src à partir d'une variable dans AngularJS

Dans AngularJS, vous pouvez rencontrer des difficultés lorsque vous tentez de définir l'attribut src d'un iFrame à partir d'une variable. Pour résoudre ce problème, nous devons nous plonger dans le code fourni :

<br>function AppCtrl($scope) {</p>
<pre class="brush:php;toolbar:false">$scope.projects = {

    1 : {
        "id" : 1,
        "name" : "Mela Sarkar",
        "url" : "http://blabla.com",
        "description" : "A professional portfolio site for McGill University professor Mela Sarkar."
    },

    2 : {
        "id" : 2,
        "name" : "Good Watching",
        "url" : "http://goodwatching.com",
        "description" : "Weekend experiment to help my mom decide what to watch."    
    }
};

$scope.setProject = function (id) {
    $scope.currentProject = $scope.projects[id];
    console.log( $scope.currentProject );

}

}

Le nœud du problème réside dans l'absence de la fonction trustSrc référencée dans l'attribut ng-src. Vous devez injecter le service $sce dans le contrôleur pour utiliser la méthode trustAsResourceUrl pour nettoyer la chaîne d'URL.

<br>function AppCtrl($scope, $sce) { // $sce injecté service</p>
<pre class="brush:php;toolbar:false">// ...

$scope.setProject = function (id) {
  $scope.currentProject = $scope.projects[id];
  $scope.currentProjectUrl = $sce.trustAsResourceUrl($scope.currentProject.url);
  console.log( $scope.currentProject );
  console.log( $scope.currentProjectUrl );

}

}

Dans le modèle :

<br><iframe ng-src=" {{currentProjectUrl}}"> <!--contenu--> </iframe><br>

En utilisant trustAsResourceUrl, vous pouvez définir en toute sécurité l'URL dans l'attribut src.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!