当我们使用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. Validate常用校验

    1.首先将jQuery.js和jquery.validate.js加入对应的页面中,如果要中文的提示语还要把messages_zh.js加入,以及对应的css文件. <link href=&qu ...

  2. python3入门教程

    python : 3.5 jdk : 1.7 eclipse : 4.5.2(有点低了,需要对应Neon 4.6,不然总是会弹出提示框) 应该学习最新版本的 Python 3 还是旧版本的 Pytho ...

  3. rosrun和roslaunch

    rosrun allows you to run an executable(可执行) in an arbitrary(任意) package without having to cd (or ros ...

  4. ROS launch总结

    1 运行Launch文件2 新建Launch文件3  在namespace中启动nodes 4   remapping names 5 其他的launch元素 1 运行Launch文件 Launch文 ...

  5. 解决input 有readonly属性 各个浏览器的光标兼容性问题

    <input type='text' readonly unselectable='on' onfocus='this.blur()'/> 目标:input 只能读,但是在ie.火狐浏览器 ...

  6. mySLQ数据库 练习题

    MySQL 练习题1 DROP TABLE IF EXISTS `liuyan`; CREATE TABLE `liuyan` ( `id` int(11) NOT NULL AUTO_INCREME ...

  7. vss登录invalid handle问题的解决办法

    VSS登录出现“invalid handle” 原因:网络验证. 解决方法: 1.打开控制面板:选择“用户帐户和家庭安全” 2.选择凭据管理器: 3.添加Windows 凭据 这一步特别重要: (1) ...

  8. ceil,floor,trunc,round,sign几个函数在SQL的使用方法

    只是在oracle的环境下进行的几个数的测试,在这里只是举例说明,没有理论说明,抱歉. select ceil(1.8) from dual; --结果为1,向上取整select floor (1.8 ...

  9. idea spring-boot gradle mybatis 搭建开发环境

    使用工具idea 2017.2开发,gradle构建项目,使用的技术有spring-boot.mybatis 1.新建项目 说明:1.src为源码路径,开发主要在src下 2.src/main/jav ...

  10. C# 出现base-64 字符数组的无效长度的解决办法

    最近的一个项目,在传递参数时,在Win2003上正常,在Win7下抛出“base-64 字符数组的无效长度”这样的错误 对比了一下经过Convert.ToBase64String()转换过的参数发现, ...