二、ionic如何使用外链
对应的controller如下:
(function() {
angular.module('app').controller('extraLinkCtrl', extraLinkCtrl);
extraLinkCtrl.$inject = ['$scope','$stateParams','$state'];
function extraLinkCtrl($scope, $stateParams,$state) {
var vm = this;
document.getElementsByName('extraLink')[0].src = 'https://' + $stateParams.link;//外链的链接地址
document.getElementsByName('extraLink')[0].height = window.screen.height;//高度自适应
vm.goHomePage = goHomePage;
function goHomePage () {
$state.go('homePage');
}
}
})();
2、使用过程中出现的问题
- 无法访问外部url的问题--两个步骤解决:
- iframe的src属性用ng-src属性替代,并指明绑定对象: ng-src="{{targetUrl}}"
- 在controller里,调用$sce: $scope.targetUrl = $sce.trustAsResourceUrl(url)
- 高度无法最大化的问题--两个步骤解决:
- ion-content 属性里添加 scroll="true" overflow-scroll="true"
- iframe的style里添加 min-height: 100%
二、ionic如何使用外链的更多相关文章
- cordova-plugin-themeablebrowser 0.2.17 "ThemeableBrowser"ionic跳转外链插件在ios中heardBar会遮住内容的bug
ionic+angular的app项目中需要在App打开一个外部的url链接,用了这个插件发现在iPhone手机中会出现toolbar挡住url页面内容 解决方法: 在原有基础上加上statusBar ...
- 【原创】Ionic单页应用跳转外链,构造路由返回的解决办法及代码
在开发广汽菲克微信企业号的填单审批webApp的时候出现了一个问题: 单据是带有附件的,而且存在各种不同的格式,需要后台处理后给前台链接地址,点击预览,微信浏览器的特性就是只能存在一个浏览器窗口, 这 ...
- JS:操作样式表3:内联和外链样式
var box = document.getElementById("box"); box.style.属性;只能读取修改行内样式. //访问元素样式2,对外链样式表进行操作 do ...
- SEO分享:我为什么会有这么多的优质外链资源?
前面小浪发了一篇文章" [完整版]我是怎样3个月把800指数的词做上首页的.",非常多人看了之后都表示非常佩服.顽强的运行力.确实SEO就是要顽强的运行力,也有人说吹牛吧,一天50 ...
- Buzzsumo大型教程(内容营销+外链outreach必备)营销神器
做内容营销,Buzzsumo基本是必备工具.做谷歌白帽SEO的百分八十应该都用过或者至少接触过.在国外就更不用说了,很多网络营销大牛眼里,Buzzsumo的重要程度绝对超过Ahrefs! Buzzsu ...
- react跳转url,跳转外链,新页面打开页面
react中实现在js中内部跳转路由,有两种方法. 方法一: import PropTypes from 'prop-types'; export default class Header exten ...
- 15.5.26-linq to ef多级外链查询
方法一: var query = db.Test.Where(x => true) .Include(x => x.ColB.Select(s => s.ColBRelated)) ...
- SEO分享:为什么我的资源外链这么多的高品质?
在小浪前制成的制品" [完整版]我怎么3的月800单词索引厨师主页!".之后,很多人都表示了极大的钦佩观看.顽强的运行力,真SEO它是运行顽强的力量.也有人说是吹牛吧,一天500外 ...
- 最新获取SkyDrive音乐外链mp3地址方法20131003
最新获取SkyDrive音乐外链方法20131003在文章底部更新,欢迎使用! 这已经是第三次写获取SkyDrive音乐外链mp3地址方法的文章了,因为第一次.第二次都失效了.三篇文章都有个共同点,都 ...
随机推荐
- Apache JMeter2.13 实战
安装目录下 设置浏览器代理127.0.0.1 8080,以chrome为例 开始录制脚本,进入应用点击相应的功能,可以捕获到如下地址 去除无用地址,保留需要测试的地址 注:上图编号列表中11为获取co ...
- JVM-Java GC分析
如何获取JavaGC日志 用动态命令查看: jstat -gc 1262 2000 20 每隔20秒输入一次日志,总共输入20次 设置GC参数打印出日志 -XX:+PrintGC 输出GC日志 -X ...
- 极光推送android sdk集成步骤
推送,用极光,大家都说好,哈哈. 进入正题: 1.确认android studio的 Project 根目录的主 gradle 中配置了jcenter支持.(基本上现在都已经支持了,循例说一下) , ...
- C/C++ -- Gui编程 -- Qt库的使用 -- Qt窗体的类型状态布局
-----工程WindowTest----- 1.-----窗体类型type.cpp----- #include <QtGui> int main(int argc, char * arg ...
- MediaWIKI部署流程
1.下载mediawiki,地址:https://www.mediawiki.org/wiki/MediaWiki 2.下载xxamp集成软件,地址:https://www.apachefriends ...
- IntelliJ IDEA使用心得之非Maven项目篇
今天和大家分享下非Maven项目在IDEA中的配置方法,由于非Maven项目的配置方法基本相同,所以此篇只对不同点进行说明. 1.声明依赖库 我们可以使用库的方式来添加项目依赖,这是一个非常好的实践. ...
- 《Tomcat日志系统详解》
综合:Tomcat下相关的日志文件 Cataline引擎的日志文件,文件名catalina.日期.log Tomcat下内部代码丢出的日志,文件名localhost.日期.log(jsp页面内部错误的 ...
- Memcached理解笔记1---安装&常规错误&监控
一.下载 1.Libevent 简单的说就是一个事件触发的网络库,Memcached离不开它. wget http://cloud.github.com/downloads/libevent/libe ...
- 前端富文本编辑器 vue-html5-editor
1..项目创建与初始化 在安装好脚手架的依赖后,要执行 npm install vue-html5-editor -S 来安装这个富文本插件,由于这个富文本插件的图标是依赖font-awesome.c ...
- haml参考大全
原文来自: http://blackanger.blog.51cto.com/140924/47642 Haml是一种用来描述任何XHTML web document的标记语言,它是干净,简单的. ...