如何更改iframe src使用angularjs

Ami*_*ath 16 javascript angularjs

<iframe src="{{url}}" width="300" height="600">
                <p>Your browser does not support iframes.</p>
            </iframe>
Run Code Online (Sandbox Code Playgroud)

如何改变iframe src

mic*_*lem 40

您还需要$sce.trustAsResourceUrl或不会在iframe中打开网站:

的jsfiddle

HTML:

<div ng-app="myApp" ng-controller="dummy">
    <button ng-click="changeIt()">Change it</button>
    <iframe ng-src="{{url}}" width="300" height="600"></iframe>
</div>
Run Code Online (Sandbox Code Playgroud)

JS:

angular.module('myApp', [])
    .controller('dummy', ['$scope', '$sce', function ($scope, $sce) {

    $scope.url = $sce.trustAsResourceUrl('https://www.angularjs.org');

    $scope.changeIt = function () {
        $scope.url = $sce.trustAsResourceUrl('https://docs.angularjs.org/tutorial');
    }
}]);
Run Code Online (Sandbox Code Playgroud)


Shi*_*ora 11

为什么不将源更改为ng-src.这样,您可以将src链接到变量,并按如下所示进行更改:

<iframe ng-src="{{url}}">  <p>Your browser does not support iframes.</p> </iframe>
Run Code Online (Sandbox Code Playgroud)

  • 仅适用于图像.需要使用$ sce.trustAsResourceUrl (2认同)