angular4模块中给标签添加背景图的实现方法


Posted in Javascript onSeptember 15, 2017

一、现象

一个全屏的“走马灯”每项需要添加背景图,在循环标签里需要动态添加行内样式

二、解决

1、首先有一个图片数组,如:

export class AppComponent {
 array = ["url(/assets/images/img1.png)","url(/assets/images/img2.png)"];
}

2、模块中添加数据,如:

<div nz-carousel-content *ngFor="let item of array" [ngStyle]="{'background-image': item }"></div>

三、总结

需要继续思考,如果数组中不带有url,只是单纯的图片路径,应该如何操作?

以上这篇angular4模块中给标签添加背景图的实现方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
常用一些Javascript判断函数
Aug 14 Javascript
基于jQuery实现模拟页面加载进度条
Apr 01 Javascript
JavaScript实现快速排序的方法
Jul 31 Javascript
javascript中apply/call和bind的使用
Feb 15 Javascript
js Canvas绘制圆形时钟效果
Feb 17 Javascript
原生javascript实现读写CSS样式的方法详解
Feb 20 Javascript
jQuery EasyUI之验证框validatebox实例详解
Apr 10 jQuery
Webpack实现按需打包Lodash的几种方法详解
May 08 Javascript
详解微信小程序设置底部导航栏目方法
Jun 29 Javascript
jQuery实现验证表单密码一致性及正则表达式验证邮箱、手机号的方法
Dec 05 jQuery
js实现时间日期校验
May 26 Javascript
用React Native制作一个简单的游戏引擎
May 27 Javascript
基于Vue生产环境部署详解
Sep 15 #Javascript
基于Vue单文件组件详解
Sep 15 #Javascript
json2.js 入门教程之使用方法与实例分析
Sep 14 #Javascript
php main 与 iframe 相互通讯类(js+php同域/跨域)
Sep 14 #Javascript
iframe与主框架跨域相互访问实现方法
Sep 14 #Javascript
VsCode插件整理(小结)
Sep 14 #Javascript
推荐VSCode 上特别好用的 Vue 插件之vetur
Sep 14 #Javascript
You might like
中国广播史趣谈 — 几个历史第一次
2021/03/01 无线电
PHPMyAdmin 快速配置方法
2009/05/11 PHP
PHP中防止SQL注入实现代码
2011/02/19 PHP
腾讯CMEM的PHP扩展编译安装方法
2015/09/25 PHP
在Laravel框架里实现发送邮件实例(邮箱验证)
2016/05/20 PHP
PHPTree――php快速生成无限级分类
2018/03/30 PHP
jquery 单击li防止重复加载的实现代码
2010/12/24 Javascript
基于jQuery实现的Ajax 验证用户名是否存在的实现代码
2011/04/06 Javascript
js 获取class的元素的方法 以及创建方法getElementsByClassName
2013/03/11 Javascript
jQuery fadeTo方法调整图片的透明度使用介绍
2013/05/06 Javascript
javascript三元运算符用法实例
2015/04/16 Javascript
jQuery绑定自定义事件的魔法升级版
2016/06/30 Javascript
Javascript的比较汇总
2016/07/25 Javascript
用js实现简单算法的实例代码
2016/09/24 Javascript
利用Angularjs中模块ui-route管理状态的方法
2016/12/27 Javascript
浅谈js script标签中的预解析
2016/12/30 Javascript
jquery实现input框获取焦点的简单实例
2017/01/26 Javascript
老生常谈jquery id选择器和class选择器的区别
2017/02/12 Javascript
nodejs中全局变量的实例解析
2017/03/07 NodeJs
聊聊Vue 中 title 的动态修改问题
2019/06/11 Javascript
JavaScript实现动态生成表格
2020/08/02 Javascript
[06:13]DOTA2进化论(修改版)
2013/10/08 DOTA
python smtplib模块自动收发邮件功能(二)
2018/05/22 Python
python多进程使用及线程池的使用方法代码详解
2018/10/24 Python
Django+Xadmin构建项目的方法步骤
2019/03/06 Python
python GUI库图形界面开发之PyQt5结合Qt Designer创建信号与槽的详细方法与实例
2020/03/08 Python
django 连接数据库出现1045错误的解决方式
2020/05/14 Python
收藏!10个免费高清视频素材网站!【设计、视频剪辑必备】
2021/03/18 杂记
NBA欧洲商店(西班牙):NBA Europe Store ES
2019/04/16 全球购物
什么是"引用"?申明和使用"引用"要注意哪些问题?
2016/03/03 面试题
中医专业职业生涯规划书范文
2014/01/04 职场文书
通信研究生自荐信
2014/02/01 职场文书
设计师个人求职信范文
2014/02/02 职场文书
个人整改方案范文
2014/10/25 职场文书
教学督导岗位职责
2015/04/10 职场文书
2015年保管员工作总结
2015/04/30 职场文书