当我们使用AngularJs的ng-repeat时候动态绑定数据时,遇到遍历出来的标签样式都一样,这时候希望根据数组的下标分别对应不同的样式

解决:使用$index获取数组下标根据下标改变样式



<div ng-repeat="item in menulist">
<div class="z_cstorge_menu">
<span class="z_cstorge_menu_ico{{$index}}"></span> <span
class="z_cstorge_text"> {{item.DirName}} </span>
</div>
</div>

ng-repeat动态改变样式的更多相关文章

  1. 微信小程序,动态改变样式

    小程序目前没有修改样式api,但是可以利用数据绑定实现动态改变样式,可以用view标签模拟page然后改变view标签的样式,以下案例演示了如果改变page背景颜色: <view class=& ...

  2. vue点击时动态改变样式 ------- 最简单的方法

    vue点击时动态改变样式 template中 <li :class="{ active:index==isActive }" @click="changeValue ...

  3. [iOS开发]TextKit之动态改变样式

    在iOS中有一项功能,就是用户可以自定义设备的字体大小,粗体和其他一些样式.具体可以选择 “设置” ---- “通用” ---- “字体大小“ / “辅助功能”, 重新调整文本字体的样式. 如何使ap ...

  4. extjs动态改变样式

    { width:438, height:440, name:'loginDiv', ui:'123', x: '50%' , y: 200, border:true, bodyStyle:{ 'bor ...

  5. vue动态改变样式

    <i class="el-icon-arrow-left" :style="{'color': deadColorArr[index]}" @click= ...

  6. Windows Phone 动态改变ListBox样式

    使用ListBox时通常会借助ItemTemplate帮助我们实现更复杂多样的样式显示,体现了Xaml的灵活.如何动态改变变ListBox的样式,实现类似电脑资源管理器中列表显示和图标显示形式的替换. ...

  7. js动态改变css伪类样式

    首先我们来看下页面上需要实现的基本效果,如下图所示: 因此我们可以使用如下js代码来试试看,是否能使用js改变伪类?如下代码所示: $(function() { $('.listnav li').cl ...

  8. 动态改变伪元素样式的方(用:after和:before生成的元素)

    自己查资料总结的两种方法 一.纯css改变 a:hover:before{left:-20%;} a:hover:after{right:-20%;} a:before{ left:-100%; } ...

  9. 动态改变actionbar上menu的图标

    工作中遇到了一个需求是,在滚动的时候让actionbar上的图标进行变色.实现后在这里总结下思路. 一.先在主题中定义好Actionbar的style <style name="App ...

随机推荐

  1. AngularJS——第11章 其它

    第11章 其它 11.1jQuery 在没有引入jQuery的前提下AngularJS实现了简版的jQuery Lite,通过angular.element不能选择元素,但可以将一个DOM元素转成jQ ...

  2. idea自动生成文档注释

    这方面主要分为两块内容,一是利用idea本身具有的生成模板工具进行生成:二是利用第三方插件生成,比如jindent 后期会进行整理更新,待续 下面的网址目前只是关于这方面的介绍,先留存一份而已 htt ...

  3. 在微信小程序中调用本地接口

    1.点击详情,并勾选项目设置中最后一行. 2.用小程序请求本地的后台服务接口 wx.request({ url: 'http://localhost:8090/DemoProject/myTest.d ...

  4. go语言io和ioutil包的学习和使用

    io包 package main; import ( "errors" "fmt" "io" ) //io包中定义了非常多的interfac ...

  5. gearman管理工具GearmanManager的安装与使用

    一.gearman自带了一个gearadmin工具 查看帮助信息 > gearadmin --help 查看状态 > gearadmin --status 查看worker信息 > ...

  6. python 大量使用json 存储数据时,格式化输出的方式

    import json, pprint dic = {'name': 234, 'user_name': 'yan xia ting yu ', 'list': ['ds', 'a', 2], '你好 ...

  7. HSTS

    一.简介   二.部署   三.其他 1)利用 HSTS 安全协议柔性解决全站HTTPS 的兼容性问题 http://www.toutiao.com/a6383719177903833346/

  8. js 箭头函数

    箭头函数 ES6标准新增了一种新的函数:Arrow Function(箭头函数). x => x * x相当于: function (x) { return x * x; }箭头函数相当于匿名函 ...

  9. 使用GrabCut提取前景图像的示范代码

    #include<opencv2/opencv.hpp> bool selectObject = false; cv::Point origin; cv::Rect selection; ...

  10. 在开发node.js中,关于使用VS2013插件出现一直读取资源的问题

    情况描述: 1.安装了VS2013: 2.安装了VS开发node.js的插件; 3.打开以前的工程文件,有的可以打开,有的打不开.而且打不开的始终停留在读取资源的界面.很痛苦的.等半天都没有反应.到底 ...