码迷,mamicode.com
首页 > 其他好文 > 详细

Ionic跳转到外网地址

时间:2016-10-11 21:14:20      阅读:200      评论:0      收藏:0      [点我收藏+]

标签:

1.安装插件

https://github.com/apache/cordova-plugin-inappbrowser

执行命令:
cordova plugin add org.apache.cordova.inappbrowser

采用命令查看:
cordova plugin ls

2.简单代码

$scope.godetail=function(unit){
      var options = {
        location: ‘yes‘,
        clearcache: ‘yes‘,
        toolbar: ‘no‘
      };
      var reg=/^([hH][tT]{2}[pP]:\/\/|[hH][tT]{2}[pP][sS]:\/\/)(([A-Za-z0-9-~]+)\.)+([A-Za-z0-9-~\/])+$/;
      if(reg.test(unit.DetailAddr)){
        $cordovaInAppBrowser.open(unit.DetailAddr, ‘_blank‘, options)
          .then(function(event) {
            // success
          })
          .catch(function(event) {
            // error
          });
        //$cordovaInAppBrowser.close();
      }
      else{
        $ionicLoading.show({
          noBackdrop: true,
          template: "地址错误",
          duration: 1500
        });
      }
    }
$rootScope.$on(‘$cordovaInAppBrowser:loadstart‘, function(e, event){
alert("I安装中了");
});
  <div class="card">
      <div class="item">
        <strong>{{HelpProc.RescueModel.UnitName}}&nbsp;<label class="price">¥{{HelpProc.RescueModel.Amount}}</label></strong>
        <div class="item" ng-repeat="unit in HelpProc.RescueModel.ListRescue" ng-click="godetail(unit)">
          <span > {{unit.UnitName}}</span>
          <div class="clearfix"></div>
          <p class="align_right "><label class="labgreen">¥{{unit.Amount}} &nbsp;{{unit.DtTime}}</label></p>
        </div>
      </div>
    </div>

3.效果图

 

参考地址:

http://www.ionic-china.com/doc/ngCordova/In%20App%20Browser.html

http://cordova.apache.org/docs/en/3.3.0/cordova/inappbrowser/inappbrowser.html

 

 

 

Ionic跳转到外网地址

标签:

原文地址:http://www.cnblogs.com/linsu/p/5950713.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!