如果直接写路径到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 路径 z-index 必须有position的更多相关文章

  1. angularjs 中的iframe 标签 ng-src 路径

    如果直接写路径到iframe标签里的ng-src中会出现报错: 解决方法: 1.ng里面有个属性是专门用来解决跨域问题的 $sce. 用法: $scope.someUrl = $sce.trustAs ...

  2. HTML <iframe> 标签的 src 属性

    HTML <iframe> 标签的 src 属性 <iframe src="/index.html"> <p>Your browser does ...

  3. thymeleaf中img标签图片src路径问题

    转载自:解决java - Thymeleaf conditional img src 正确写法. <img class="layui-nav-img" th:src=&quo ...

  4. react项目中关于img标签的src属性的使用

    在一个html文件中,img的src属性赋值为相对路径或绝对路径的字符串即可访问到图片.如下: <img src="../images/photo.png"/> 但在j ...

  5. angularjs中动态为audio绑定src

    今天在angularjs中用audio的时候碰到的这些问题,查阅http://www.cnblogs.com/rachelanlan/p/3598070.html获得解决,感谢! <div cl ...

  6. AngularJS 中<a> 超链接标签不起作用?

    开始时遇到个问题,单页应用<a>元素链接点击就是不跳转页面,使用超链接标签<a href='group'>click</a> 不起作用. 解决方法: 如果你不巧配置 ...

  7. angularjs中动态为audio绑定src问题总结

    先上代码 <div class="block_area block_audio" ng-show="model.url"> <audio co ...

  8. Thymleaf中th:each标签遍历list如何获取index

    简单介绍:传递给后台一个String类型的list,需要获取到list的每一个元素,然后进行筛选,得到正确的文本值,看代码就明白了 代码: //后台java代码//failList是一个String类 ...

  9. 怎样在一个HTML中嵌入另一个HTML页面(iframe标签用法)

    iframe 怎么 在一个网页中嵌入另一个网页呢,我们可以用html中的iframe标签搞定. iframe支持所有浏览器.下面来看语法: <iframe src="规定在 ifram ...

随机推荐

  1. 【MVC5】First AngularJS

    ※本文参照<ASP.NET MVC 5高级编程(第5版)> 1.创建Web工程 1-1.选择ASP.NET Web Application→Web API 工程名为[atTheMovie] ...

  2. Linux Java开发环境

    一.旧版本JDK卸载 1.卸载系统自带JDK版本 #rpm -qa|grep gcj 查看到如下信息,如图所示:   进行卸载默认安装JDK: #rpm -e --nodeps java-1.4.2- ...

  3. ganlia安装配置文档

    gangliaz在ubuntu中安装和配置很简单 1.  服务器端安装 sudo apt-get install ganglia-monitor ganglia-webfrontend rrdtool ...

  4. mysql更改表结构:添加、删除、修改字段、调整字段顺序

    添加字段: alter table `user_movement_log` Add column GatewayId int not null default 0 AFTER `Regionid` ( ...

  5. js删除cookie的方法

    以上图片有两种方法,推荐第二种

  6. "下列引导或系统启动驱动程序无法加载: cdrom"的解决方案

    1.进入注册表(开始->运行->regedit) 2.展开HKEY_LOCAL_MACHINE\SYSTEM\CurrentControlSet\services\cdrom 3.把Sta ...

  7. ifconfig 命令

    许多windows非常熟悉ipconfig命令行工具,它被用来获取网络接口配置信息并对此进行修改.Linux系统拥有一个类似的工具,也就是ifconfig(interfaces config).通常需 ...

  8. static 修饰的变量在程序中容易出现的问题

    package lianxi; public class StaticTest {    int a = 0;    static int b =0;    StaticTest(){         ...

  9. linux flush memcache缓存

    telnet localhost 11211 flush_all  memcached Telnet Interface Command Description Example get Reads a ...

  10. nginx http proxy 正向代理

    配置 Nginx Http Proxy 代理服务器,与 [Squid] 功能一样,适用于正向代理 Http 网站. 一,Nginx 正向代理配置文件: server { resolver 8.8.8. ...