How to use an iframe as ngView?

2019-09-08 23:35发布

I've a page called 'index.html' it has left pane with multiple links and right pane which contains iframe.

When I click a link from left pane the page(not external sites or pages) should get load inside iframe.

1条回答
家丑人穷心不美
2楼-- · 2019-09-09 00:11

Angular supports ng-src on iframe , so you can set ng-src with your url like this.

<div><iframe  width="640" height="385" ng-src="{{getUrl()}}"> </iframe></div>

The getUrl sanitizes the url before setting it on the iframe. The controller will be as simple as this.

$scope.currentUrl = "http://www.youtube.com/embed/Lx7ycjC8qjE";

  $scope.urls = [
    {
      name:"http://www.youtube.com/embed/Lx7ycjC8qjE"
    },
    {
      name:"http://www.youtube.com/embed/mMxQHmvQ1pA"
    }];

    $scope.setCurrentUrl = function(url)
    {
      $scope.currentUrl = url;
    }

    $scope.getUrl = function()
    {
      console.log($scope.currentUrl);
       return $sce.trustAsResourceUrl($scope.currentUrl);
    }

Here is a sample plnkr.

http://plnkr.co/edit/EVkyH8LuCXcsWUi1xnvV?p=preview

查看更多
登录 后发表回答