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 相关文章推荐
日期函数扩展类Ver0.1.1
Sep 07 Javascript
基于jquery实现的移入页面上空文本框时,让它变为焦点,移出清除焦点
Jul 26 Javascript
jquery tab插件精简版分享
Sep 10 Javascript
jquery 提示信息显示后自动消失的具体实现
Dec 18 Javascript
Javascript 正则表达式实现为数字添加千位分隔符
Mar 10 Javascript
JS实现网页游戏中滑块响应鼠标点击移动效果
Oct 19 Javascript
详解Vue中一种简易路由传参办法
Sep 15 Javascript
浅谈JavaScript_DOM学习篇_图片切换小案例
Mar 19 Javascript
vue实现固定位置显示功能
May 30 Javascript
vue.js购物车添加商品组件的方法
Sep 17 Javascript
JS中自定义事件的使用与触发操作实例分析
Nov 01 Javascript
JS实现购物车基本功能
Nov 08 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
蝙蝠侠:侠影之谜
2020/03/04 欧美动漫
[EPIC] Larva vs Flash ZvT @ Crossing Field [2017-10-09]
2020/03/17 星际争霸
PHP数组操作汇总 php数组的使用技巧
2011/07/17 PHP
ThinkPHP CURD方法之where方法详解
2014/06/18 PHP
php删除左端与右端空格的方法
2014/11/29 PHP
thinkphp3.x中session方法的用法分析
2016/05/20 PHP
用YUI做了个标签浏览效果
2007/02/20 Javascript
JavaScript高级程序设计(第3版)学习笔记6 初识js对象
2012/10/11 Javascript
CSS鼠标响应事件经过、移动、点击示例介绍
2013/09/04 Javascript
js动画效果制件让图片组成动画代码分享
2014/01/14 Javascript
2016年最热门的15 款代码语法高亮工具,美化你的代码
2016/01/06 Javascript
JS实现六边形3D拖拽翻转效果的方法
2016/09/11 Javascript
js获取json中key所对应的value值的简单方法
2020/06/17 Javascript
iframe与主框架跨域相互访问实现方法
2017/09/14 Javascript
JavaScript中Object值合并方法详解
2017/12/22 Javascript
深入学习TypeScript 、React、 Redux和Ant-Design的最佳实践
2019/06/17 Javascript
浅析Angular 实现一个repeat指令的方法
2019/07/21 Javascript
微信小程序 生成携带参数的二维码
2019/10/23 Javascript
javascript递归函数定义和用法示例分析
2020/07/22 Javascript
[53:15]Mineski vs iG 2018国际邀请赛小组赛BO2 第二场 8.16
2018/08/17 DOTA
在Gnumeric下使用Python脚本操作表格的教程
2015/04/14 Python
浅析python3中的os.path.dirname(__file__)的使用
2018/08/30 Python
python实现贪吃蛇游戏
2020/03/21 Python
python主要用于哪些方向
2020/07/05 Python
Python如何定义有默认参数的函数
2020/08/10 Python
英国在线女鞋目的地:SIMMI
2018/12/27 全球购物
中职生自我鉴定范文
2013/10/03 职场文书
大学生预备党员自我评价分享
2013/11/16 职场文书
珍爱生命演讲稿
2014/05/10 职场文书
承诺书样本
2014/08/30 职场文书
2014教师“四风问题”对照检查材料思想汇报
2014/09/16 职场文书
个人遵守党的政治纪律情况对照检查材料思想汇报
2014/09/25 职场文书
志愿者事迹材料
2014/12/26 职场文书
2015年秋季新学期寄语
2015/03/25 职场文书
Python中zipfile压缩包模块的使用
2021/05/14 Python
Oracle 11g数据库使用expdp每周进行数据备份并上传到备份服务器
2022/06/28 Oracle