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}} <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}} {{unit.DtTime}}</label></p> </div> </div> </div>
3.效果图
备注:这个是ngcordova 的写法,cordova 写法参考其它
参考地址:
http://www.ionic-china.com/doc/ngCordova/In%20App%20Browser.html
http://cordova.apache.org/docs/en/3.3.0/cordova/inappbrowser/inappbrowser.html