编程 Javascript

AngularJS基础 ng-srcset 指令简单示例

Posted in Javascript onAugust 03, 2016

AngularJS ng-srcset 指令

AngularJS 实例

定义图片的资源地址:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
</head>
<body ng-app="">

<div ng-init="myVar = 'http://www.runoob.com/wp-content/uploads/2014/06/angular.jpg'">
<h1>Angular</h1>
<img ng-srcset="{{myVar}}">
</div>

<p>该实例可以使用原生的 srcset 输出，但是使用 AngularJS 代码插入值，使用 ng-srcset 属性更好。</p>

</body>
</html>

定义和用法

ng-srcset 指令覆盖了 <img> 元素的 srcset 属性。

如果你使用了 AngularJS 代码设置图片地址，请使用 ng-srcset 指令替代 srcset 属性。

ng-srcset 指令确保的 AngularJS 代码执行前不显示图片。

语法

<img> 和 <source> 元素支持该属性。

参数值

值	描述
string	表达式返回的字符串。

以上就是对ng-srcset 指令的基础资料整理，后续继续整理，谢谢大家对本站的支持！

AngularJS基础 ng-srcset 指令简单示例

- Author -

lqh

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

JavaScript 异步方法队列链实现代码分析

Jun 05 Javascript

父页面显示遮罩层弹出半透明状态的dialog

Mar 04 Javascript

Three.js学习之网格

Aug 10 Javascript

js实现简单的计算器功能

Jan 16 Javascript

Bootstrap框架安装使用详解

Jan 21 Javascript

使用vue框架 Ajax获取数据列表并用BootStrap显示出来

Apr 24 Javascript

vue2.0 中#$emit,$on的使用详解

Jun 07 Javascript

关于webpack代码拆分的解析

Jul 20 Javascript

webpack+react+antd脚手架优化的方法

Apr 02 Javascript

layui自己添加图片按钮并点击跳转页面的例子

Sep 14 Javascript

three.js利用gpu选取物体并计算交点位置的方法示例

Nov 25 Javascript

js最全的数组的降维5种办法(小结)

Apr 28 Javascript

js删除Array数组中指定元素的两种方法

Aug 03 #Javascript

AngularJS基础 ng-src 指令简单示例

Aug 03 #Javascript

JS在Chrome浏览器中showModalDialog函数返回值为undefined的解决方法

Aug 03 #Javascript

AngularJS基础 ng-show 指令简单示例

Aug 03 #Javascript

JavaScript判断数组是否存在key的简单实例

Aug 03 #Javascript

AngularJS基础 ng-selected 指令简单示例

Aug 03 #Javascript

jQuery 判断是否包含在数组中Array[]的方法

Aug 03 #Javascript

You might like

使用无限生命期Session的方法

2006/10/09 PHP

php模板函数正则实现代码

2012/10/15 PHP

PHP解码unicode编码的中文字符代码分享

2014/08/13 PHP

PHP中empty,isset,is_null用法和区别

2017/02/19 PHP

在JavaScript中，为什么要尽可能使用局部变量？

2009/04/06 Javascript

JS数组的常见用法实例

2015/02/10 Javascript

javascript制作游戏开发碰撞检测的封装代码

2015/03/31 Javascript

轻量级的原生js日历插件calendar.js使用指南

2015/04/28 Javascript

javascript中innerText和innerHTML属性用法实例分析

2015/05/13 Javascript

Javascript基于AJAX回调函数传递参数实例分析

2015/12/15 Javascript

jquery自定义插件——window的实现【示例代码】

2016/05/06 Javascript

解析Javascript单例模式概念与实例

2016/12/05 Javascript

JavaScript中object和Object的区别(详解)

2017/02/27 Javascript

jQuery动态产生select option下拉列表

2017/03/15 Javascript

还不懂递归？读完这篇文章保证你会懂

2018/07/29 Javascript

React注册倒计时功能的实现

2018/09/06 Javascript

JavaScript高阶教程之“==”隐藏下的类型转换

2019/04/11 Javascript

node中实现删除目录的几种方法

2019/06/24 Javascript

Nuxt.js实战和配置详解

2019/08/05 Javascript

vue+element-ui+axios实现图片上传

2019/08/20 Javascript

p5.js实现动态图形临摹

2019/10/23 Javascript

JavaScript canvas实现跟随鼠标事件

2020/02/10 Javascript

python脚本实现数据导出excel格式的简单方法(推荐)

2016/12/30 Python

Python字符串通过'+'和join函数拼接新字符串的性能测试比较

2019/03/05 Python

使用python制作一个为hex文件增加版本号的脚本实例

2019/06/12 Python

Python queue队列原理与应用案例分析

2019/09/27 Python

centos7中安装python3.6.4的教程

2019/12/11 Python

Python利用多线程同步锁实现多窗口订票系统(推荐)

2019/12/22 Python

python数据预处理 :数据共线性处理详解

2020/02/24 Python

英国顶级水晶珠宝零售商之一：Tresor Paris

2019/04/27 全球购物

空指针到底是什么

2012/08/07 面试题

社区精神文明建设汇报材料

2014/08/17 职场文书

2014年工作总结及2015工作计划

2014/12/12 职场文书

工厂仓管员岗位职责

2015/04/01 职场文书

2015教师节通讯稿

2015/07/20 职场文书

javascript函数式编程基础

2021/09/15 Javascript