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事件模型代码
Jul 01 Javascript
深入理解JavaScript系列(8) S.O.L.I.D五大原则之里氏替换原则LSP
Jan 15 Javascript
使用jQuery实现星级评分代码分享
Dec 09 Javascript
JavaScript给按钮绑定点击事件(onclick)的方法
Apr 07 Javascript
jquery实现图片预加载
Dec 25 Javascript
JS如何判断json是否为空
Jul 06 Javascript
Vue数组更新及过滤排序功能
Aug 10 Javascript
js断点调试经验分享
Dec 08 Javascript
AngularJS修改model值时,显示内容不变的实例
Sep 13 Javascript
15分钟深入了解JS继承分类、原理与用法
Jan 19 Javascript
vue实现短信验证码输入框
Apr 17 Javascript
Element Collapse 折叠面板的使用方法
Jul 26 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
PHP采集腾讯微博的实现代码
2012/01/19 PHP
php检查函数必传参数是否存在的实例详解
2017/08/28 PHP
Avengerls vs Newbee BO3 第三场2.18
2021/03/10 DOTA
JavaScript类型转换方法及需要注意的问题小结(挺全面)
2010/11/11 Javascript
Javascript 类、命名空间、代码组织代码
2011/07/31 Javascript
JS自动缩小超出大小的图片
2012/10/12 Javascript
Jquery选择器中使用变量实现动态选择例子
2014/07/25 Javascript
javascript递归回溯法解八皇后问题
2015/04/22 Javascript
简单谈谈javascript Date类型
2015/09/06 Javascript
vue拦截器Vue.http.interceptors.push使用详解
2017/04/22 Javascript
angularjs 页面自适应高度的方法
2018/01/17 Javascript
详解Vue SSR( Vue2 + Koa2 + Webpack4)配置指南
2018/11/13 Javascript
Nuxt项目支持eslint+pritter+typescript的实现
2019/05/20 Javascript
Vue父组件如何获取子组件中的变量
2019/07/24 Javascript
Vue 权限控制的两种方法(路由验证)
2019/08/16 Javascript
基于aotu.js实现微信自动添加通讯录中的联系人功能
2020/05/28 Javascript
[02:36]DOTA2上海特锦赛 回忆电竞生涯的重要瞬间
2016/03/25 DOTA
python批量生成本地ip地址的方法
2015/03/23 Python
Python字符串详细介绍
2015/05/09 Python
Win7下搭建python开发环境图文教程(安装Python、pip、解释器)
2016/05/17 Python
python实现rsa加密实例详解
2017/07/19 Python
Bottle框架中的装饰器类和描述符应用详解
2017/10/28 Python
OpenCV 模板匹配
2019/07/10 Python
python使用tomorrow实现多线程的例子
2019/07/20 Python
pycharm重命名文件的方法步骤
2019/07/29 Python
详解Django CAS 解决方案
2019/10/30 Python
浅析Python模块之间的相互引用问题
2021/02/26 Python
CSS3 二级导航菜单的制作的示例
2018/04/02 HTML / CSS
无谷物狗粮:Pooch & Mutt
2018/05/23 全球购物
工程力学专业毕业生求职信
2013/10/06 职场文书
人力管理专业毕业生求职信
2014/02/27 职场文书
毕业生自荐信如何写
2014/03/24 职场文书
护理专科毕业自荐信范文
2014/04/21 职场文书
2015年学校减负工作总结
2015/05/19 职场文书
家长意见书
2015/06/04 职场文书
uniapp 微信小程序 自定义tabBar 导航
2022/04/22 Javascript