<iframe src="{{url}}" width="300" height="600">
<p>Your browser does not support iframes.</p>
</iframe>
How to change iframe src
Add a comment
|
2 Answers
You need also $sce.trustAsResourceUrl or it won't open the website inside the iframe:
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>
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');
}
}]);
Why don't you change the source to ng-src. That way, you may link the src to a variable, and change it as follows:
<iframe ng-src="{{url}}"> <p>Your browser does not support iframes.</p> </iframe>
2 Comments
Kamal Kumar
works only for image. need to use $sce.trustAsResourceUrl
Lakatos Gyula
@KamalKumar Yeah you need to use $sce but without ng-src you will get a bunch of console errors and bad requests.