如何从AngularJS中的变量中设置iframe src属性
src
<div class="col-xs-12" ng-controller="AppCtrl"> <ul class=""> <li ng-repeat="project in projects"> <a ng-click="setProject(project.id)" href="">{{project.url}}</a> </li> </ul> <iframe ng-src="{{trustSrc(currentProject.url)}}"> Something wrong... </iframe></div>
function AppCtrl ($scope) { $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 ); }}
src
更新1:$sce
TrustedValueHolderType
src="{{trustUrl(currentProjectUrl))}}"
更新2:
更新3:
$scope.setProject = function (id) { $scope.currentProject = $scope.projects[id]; $scope.currentProjectUrl = $sce.trustAsResourceUrl($scope.currentProject.url); console.log( $scope.currentProject ); console.log( $scope.currentProjectUrl );}