Ionic App中嵌入外部网页的问题

在app中不可避免的要引用第三方的页面，那么在Ionic中是如何实现呢？

1.设计引用外部页面的html框架页面，分3部分，表头有2个按钮，中间是引用的页面，底部隐藏分享相关按钮，具体页面如下：

<ion-view title="{{title}}" >

    <ion-nav-buttons side="left">

      <a class="button button-icon ion-ios-arrow-back" ng-click="toClose()"></a>

    </ion-nav-buttons>

    <ion-nav-buttons side="right">

      <button class="button button-icon icon ion-android-share-alt" ng-disabled="showShare" ng-click="share()"></button>

    </ion-nav-buttons>

    <ion-content >

        <iframe id="extendIf" name="extendIf" ng-src="{{::plink}}" allowtransparency="true" allowfullscreen="true" 
　　　　　　　　allowfullscreenInteractive="true" border="0" frameborder="0" style="width:100%;height:100%;">
        </iframe>

    </ion-content>

    <div class="bar bar-footer ">

       <button class="button button-icon ion-ios-arrow-left" ng-click="hisGo(-1)" ng-disabled="hasBack" ></button>

       <button class="button button-icon ion-ios-arrow-right" ng-click="hisGo(1)" ng-disabled="hasForward"></button>

       <button class="button button-icon ion-ios-loop" ng-click="hisGo(0)"></button>

    </div>

</ion-view>

　　主要还是使用了iframe标签。

2.设计对应的Controller层，接收用户的调用，代码如下：

angular.module("ionicApp.controllers")

.controller("OuterHtmlFrameController",function($scope, $stateParams, $interval)

{

	function toCheck()

  	{

  		    var o = $interval(function()

  		    {

  			        var frame = $("#extendIf").contents();

  			        $scope.title = frame.find("title").text();

  			        $scope.showShare = false;

  			        $scope.title && $interval.cancel(o);

  		    }, 100);

  	}

  	try

  	{

  		    $scope.plink = $stateParams.link;

  		    $scope.hasBack = 0;

  		    $scope.hasForward = 0;

  		    toCheck();

  		    $("#extendIf").load(function()

  		    　　　　　　{

  			        　　　　　　toCheck();

  			        　　　　　　$(this).contents().find("[target='_blank']").attr("target", "_self");

  		    　　　　　　});

  		    $scope.hisGo = function(e)

  		    {

  		          //.....

  		    };

  		    $scope.share = function()

  		    {

  			 //.....

  		    };

  	}

  	catch (r)

  	{

  		          $scope.hideLoad();

  		          console.log(r);

  	}

});

　　

3.调用外部页面

$state.transitionTo("outerHtmlFrame", { link: "http:baidu.com" });//　outerHtmlFrame为路由标记名