angularjs 中的iframe 标签 ng-src 路径
如果直接写路径到iframe标签里的ng-src中会出现报错;
解决方法:
1、ng里面有个属性是专门用来解决跨域问题的 $sce。
用法:
$scope.someUrl = $sce.trustAsResourceUrl('路径');
例:
<ul class="nav nav-tabs" ng-repeat="item in [1,2,3,4]">
<iframe ng-src="{{someUrl}}" height="100%" width="100%"></iframe>
</ul>
2、可以巧用上面方法写一个过滤器。
angular.module('filters-module', [])
.filter('trustAsResourceUrl', ['$sce', function($sce) {
return function(val) {
return $sce.trustAsResourceUrl(val);
};
}])
例:
<ul class="nav nav-tabs" ng-repeat="item in [1,2,3,4]">
<iframe ng-src="{{someUrl |trustAsResourceUrl }}" height="100%" width="100%"></iframe>
</ul>
angularjs 中的iframe 标签 ng-src 路径的更多相关文章
- angularjs 中的iframe 标签 ng-src 路径 z-index 必须有position
如果直接写路径到iframe标签里的ng-src中会出现报错: 解决方法: 1.ng里面有个属性是专门用来解决跨域问题的 $sce. 用法: $scope.someUrl = $sce.trustAs ...
- HTML <iframe> 标签的 src 属性
HTML <iframe> 标签的 src 属性 <iframe src="/index.html"> <p>Your browser does ...
- thymeleaf中img标签图片src路径问题
转载自:解决java - Thymeleaf conditional img src 正确写法. <img class="layui-nav-img" th:src=&quo ...
- react项目中关于img标签的src属性的使用
在一个html文件中,img的src属性赋值为相对路径或绝对路径的字符串即可访问到图片.如下: <img src="../images/photo.png"/> 但在j ...
- angularjs中动态为audio绑定src
今天在angularjs中用audio的时候碰到的这些问题,查阅http://www.cnblogs.com/rachelanlan/p/3598070.html获得解决,感谢! <div cl ...
- AngularJS 中<a> 超链接标签不起作用?
开始时遇到个问题,单页应用<a>元素链接点击就是不跳转页面,使用超链接标签<a href='group'>click</a> 不起作用. 解决方法: 如果你不巧配置 ...
- angularjs中动态为audio绑定src问题总结
先上代码 <div class="block_area block_audio" ng-show="model.url"> <audio co ...
- 怎样在一个HTML中嵌入另一个HTML页面(iframe标签用法)
iframe 怎么 在一个网页中嵌入另一个网页呢,我们可以用html中的iframe标签搞定. iframe支持所有浏览器.下面来看语法: <iframe src="规定在 ifram ...
- iframe标签flash遮盖页面元素问题——wmode参数
最近做项目过程中,遇到各种小问题,所以打算通过博客园来记录各问题的解决办法. 这篇的问题背景是这样子的:项目是用的AngularJS框架,在某个页面上用了wangEditor富文本编辑器插件(gith ...
随机推荐
- gof设计模式回顾
gof23根据讲师学习笔记回顾: 1.gof:Gang of Four;叫grasp更具有针对性,解决具体的问题; ---------------------总共分为三大类: ---------创建型 ...
- GIT+云盘作 做 文档管理工具
GIT+云盘作 做 文档管理工具 在工作中, 会遇到公司的文档 和 自己家里的 文档进行同步的问题, 通常我们使用U盘作为传输节制, 但是不是非常好,文档的改动都不能发现, 导致回家同步的时候, 出各 ...
- API变了,客户端怎么办?
使用ASP.NET Web Api构建基于REST风格的服务实战系列教程[九]——API变了,客户端怎么办? 系列导航地址http://www.cnblogs.com/fzrain/p/3490137 ...
- 变易算法 - STL算法
欢迎访问我的新博客:http://www.milkcu.com/blog/ 原文地址:http://www.milkcu.com/blog/archives/mutating-algorithms.h ...
- Knockout, Web API 和 ASP.Net Web Forms 进行简单数据绑定
使用Knockout, Web API 和 ASP.Net Web Forms 进行简单数据绑定 原文地址:http://www.dotnetjalps.com/2013/05/Simple-da ...
- .net通用底层搭建
.net通用底层搭建 之前写过几篇,有朋友说看不懂,有朋友说写的有点乱,自己看了下,的确是需要很认真的看才能看懂整套思路. 于是写下了这篇. 1.这个底层,使用的是ado.net,微软企业库 2.实体 ...
- Xcode开发和调试总结
Xcode是iOS开发主要的工具.IDE.关于Xcode的细枝末节,可以参考苹果的官方文档或者众多的说明.此文档主要涉及常用开发和调试注意事项,参考版本为Xcode 5.1.1. 目标设置: 在此,我 ...
- 清除在Windows下访问共享文件夹时的登录信息
清除在Windows下访问共享文件夹时的登录信息 在实际工作中,经常需要访问局域网内其他机子上的共享文件夹,例如\\192.168.1.100\d$ , 首次访问时,需要输入用户名和密码才可以进入,即 ...
- mac下安装eclipse以及python
因为前几天刚重装了我的mac osx 系统,从昨天开始我就在安装各种软件,当我安装好破解版的myeclipse后,在我安装pydev插件的时候,虽然现实成功但是在preference中死活找不到pyd ...
- Emacs助力PowerShell
Emacs助力PowerShell 阅读目录 1 下载安装Emacs windows版本 2 下载el文件和配置Emacs加载PowerShell 3 体验用Emacs来执行和编辑PowerShell ...