编程 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 相关文章推荐

原生JS实现平滑回到顶部组件

Mar 16 Javascript

javascript工厂模式和构造函数模式创建对象方法解析

Dec 30 Javascript

vue使用watch 观察路由变化，重新获取内容

Mar 08 Javascript

JavaScript实现简单的四则运算计算器完整实例

Apr 28 Javascript

AngularJS实用基础知识_入门必备篇(推荐)

Jul 10 Javascript

layer弹出层父子页面事件相互调用方法

Aug 17 Javascript

vue上传图片到oss的方法示例（图片带有删除功能）

Sep 27 Javascript

React Hooks的深入理解与使用

Nov 12 Javascript

js删除对象/数组中null、undefined、空对象及空数组方法示例

Nov 14 Javascript

react组件从搭建脚手架到在npm发布的步骤实现

Jan 09 Javascript

jquery实现商品sku多属性选择功能（商品详情页）

Dec 20 jQuery

微信小程序pinker组件使用实现自动相减日期

May 07 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

php实现的操作excel类详解

2016/01/15 PHP

2016/09/14 PHP

详细分析PHP 命名空间(namespace)

2020/06/30 PHP

Ajax 数据请求的简单分析

2011/04/05 Javascript

js判断ie版本号的简单实现代码

2014/03/05 Javascript

js实现带按钮的上下滚动效果

2015/05/12 Javascript

JQuery入门基础小实例(1)

2015/09/17 Javascript

详解微信第三方小程序代开发

2017/06/23 Javascript

Webpack中雪碧图插件使用详解

2018/05/25 Javascript

vue打包的时候自动将px转成rem的操作方法

2018/06/20 Javascript

微信小程序实现蒙版弹窗效果

2018/11/01 Javascript

使用rollup打包JS的方法步骤

2018/12/05 Javascript

js纯前端实现腾讯cos文件上传功能的示例代码

2019/05/14 Javascript

jquery中attr、prop、data区别与用法分析

2019/09/25 jQuery

微信公众号H5之微信分享常见错误和问题(小结)

2019/11/14 Javascript

javascript跳转与返回和刷新页面的实例代码

2019/11/20 Javascript

从零使用TypeScript开发项目打包发布到npm

2020/02/14 Javascript

Nuxt配置Element-UI按需引入的操作方法

2020/07/06 Javascript

[01:15:15]VG VS EG Supermajor小组赛B组胜者组第一轮 BO3第二场 6.2

2018/06/03 DOTA

python中getattr函数使用方法 getattr实现工厂模式

2014/01/20 Python

python 2.6.6升级到python 2.7.x版本的方法

2016/10/09 Python

Python建立Map写Excel表实例解析

2018/01/17 Python

Python之列表的插入&替换修改方法

2018/06/28 Python

Django 自定义分页器的实现代码

2019/11/24 Python

通过实例简单了解Python中yield的作用

2019/12/11 Python

Python decorator拦截器代码实例解析

2020/04/04 Python

Pytorch十九种损失函数的使用详解

2020/04/29 Python

Python中pass的作用与使用教程

2020/11/13 Python

纯CSS3打造动感漂亮时尚的扇形菜单

2014/03/18 HTML / CSS

CSS3提交意见输入框样式代码

2014/10/30 HTML / CSS

手工制作的意大利太阳镜和光学元件：Illesteva

2019/01/19 全球购物

新年联欢会主持词

2014/03/27 职场文书

局机关干部群众路线个人对照检查材料思想汇报

2014/10/05 职场文书

python 常用的异步框架汇总整理

2021/06/18 Python

一文搞懂python异常处理、模块与包

2021/06/26 Python

详解CSS中的特指度和层叠问题

2021/07/15 HTML / CSS