嵌套 ng-repeat 中的 Angularjs ng-class-odd

2023-12-09

我正在尝试开发一个非常通用的表格输出器 - 没有设定的行数或列数。因此,我有嵌套的 ng-repeat 属性,如下所示:

<table>
    <tr ng-repeat="row in rowList">
        <td ng-repeat="col in colList">{{printCell(row,col)}}</td>
    </tr>
</table>

效果很好!直到我尝试使用ng-class-even and ng-class-odd相应地更改行的背景颜色。

如果我把ng-class-***的声明td标签,我得到交替的列颜色。

如果我把ng-class-***的声明tr标签,没看懂any班级作业 - 它们都保持默认。

我想要交替的行颜色。我该怎么做呢?


的价值ng-class-odd and ng-class-even可以是一个字符串:ng-class-odd="'myClass'"或一个表达式ng-class-odd="{myClass: boolExpression}"

Also:

角度 1.2+:ng-class="{even: $even, odd: $odd}"

<table>
    <tr ng-repeat="row in rowList" ng-class="{even: $even, odd: $odd}">
        <td ng-repeat="col in colList">{{printCell(row,col)}}</td>
    </tr>
</table>
<hr />

角度 ng-class="{even: !($index%2), odd: ($index%2)}"

<table>
    <tr ng-repeat="row in rowList" ng-class="{even: !($index%2), odd: ($index%2)}">
        <td ng-repeat="col in colList">{{printCell(row,col)}}</td>
    </tr>
</table>

例子:http://jsfiddle.net/TheSharpieOne/JYn7S/1/

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

嵌套 ng-repeat 中的 Angularjs ng-class-odd 的相关文章

随机推荐

  • “this”是否指的是调用此函数的元素?

    在下面的代码片段中我使用 this 引用调用该函数的元素 我知道这是不正确的 因为我打印了这些值 它给了我 未定义 如何引用输入元素 function datepicker datepicker onSelect function date
  • 如何像“netstat -p”一样但更快?

    netstat p 和 lsof n i P 似乎都读取链接所有进程 fd 例如stat proc fd 怎样做才能更有效率呢 我的程序想知道哪个进程正在连接到它 一次又一次地遍历所有流程似乎效率太低 建议 iptables 或内核补丁的方
  • 引导网格与折叠容器之间

    这是我的第一个问题 我希望你能帮助我 我正在尝试使用引导网格设置产品概述页面 我已经连续购买了 4 款大屏幕产品 对于较小的屏幕尺寸 我希望每行有 2 个产品 诀窍是 我想将产品详细信息放在行之间的折叠容器中 当我单击产品时 该容器会打开
  • 多处理打印语句在 Spyder IDE 中不起作用

    在运行 Windows Server 2012 R2 的计算机上 在 Anaconda 的 Spyder IDE 中并使用以下代码运行 Python 3 7 import time import multiprocessing start
  • 使用 pyqtgraph 绘图而不显示

    我正在尝试从 matplotlib 转向使用 pyqtgraph 进行绘图 因为它具有更快地渲染和保存图像的能力 当我尝试在具有多处理器的集群上执行此操作时 我遇到了以下问题 QStandardPaths XDG RUNTIME DIR未设
  • 在 Android 上设置 MonkeyRunner

    我想使用 MonkeyRunner 我有一个 Monkeyrunner jar 并将其导入到我的项目中 我现在该如何使用它 你能告诉我我应该一步一步做什么吗 我在 python 上看到了一些代码片段 但我不明白如何在 eclipse 中使用
  • 无法使用spark从s3存储桶读取

    val spark SparkSession builder appName try1 master local getOrCreate val df spark read json s3n BUCKET NAME FOLDER FILE
  • iOS 7 更改 UINavigationBar titleView alpha

    所以我使用iOS7的UINavigationBar组件 而不是UINavigationController本身 当我使用自定义导航控制器推送新视图时 我想将标题的 alpha 更改为 0 0 然后再更改回来 但我似乎无法让它工作 我正在尝试
  • Android 以编程方式向应用程序添加小部件警告消息

    我创建了一个测试 Android 启动器应用程序 并将其作为系统应用程序安装在已 root 的设备上 该应用程序的目标是将所有已安装的小部件放置在视图页面的片段上 这已经成功完成 但是 每次显示新页面时都会向用户显示一条消息 即使用户选中该
  • 日历班级时间月份不匹配

    Calendar c Calendar getInstance System out println Mili gt gt c getTimeInMillis System out println Month gt gt Calendar
  • 是否可以重置 ServicePointManager?

    我正在尝试遵循类似于给出的代码System Net Mail SMTPClient如何进行本地IP绑定我在具有多个 IP 地址的计算机上使用 Windows 7 和 Net 4 0 我有绑定IPEndPointDelegate定义的 pri
  • Android Realm - 从服务访问 Realm 对象

    我有一个在我的活动中创建的领域对象 我需要能够在我创建的服务中访问该对象 但是 我在服务中创建 Realm 对象时收到错误 mRealm Realm getInstance getApplicationContext java lang I
  • 从 zip 文件中提取文件并保留 mod 日期?

    我正在尝试使用 Python 2 7 1 在 Windows 上 仅供参考 从 zip 文件中提取文件 并且我的每次尝试都显示提取的文件的修改日期 提取时间 这是不正确的 import os zipfile outDirectory C T
  • 从 APK 安装应用程序时出现 java.lang.ClassNotFoundException [重复]

    这个问题在这里已经有答案了 我在下面描述的错误发生在以下情况 直接通过 APK 在设备上安装应用程序 通过 Play 商店下载应用程序 在以下情况下不会发生该错误 通过 Eclipse 安装 apk 按下 运行 按钮 java lang R
  • 使用反射来指定委托的类型(附加到事件)?

    我实际上想做的是这样的 我意识到这不是有效的代码 Attach the event try EventInfo e mappings name e EventHandlerType handler sender raw gt AutoWra
  • 当 Activity 从 Web 服务请求 SoapObject 时,如何实现 ProgressDialog?

    我知道带有线程的 ProgressDialog 问题已被问过很多次 但似乎没有一个解决方案适合我的项目 基本上我想做的是这样的 1 当用户单击按钮时 活动向服务器发送身份验证请求 2 执行此操作时会显示 ProgressDialog 3 当
  • 如何在html代码中打印twig变量

    我创建了一个变量 如下所示 set checkboxHTML
  • AndEngine 加载库时出错

    我在运行 andengine 的示例时遇到问题 我收到的错误是在这一行 System loadLibrary andenginephysicsbox2dextension 无法加载 andenginephysicals2 扩展 查找库返回
  • 在Jquery中如何处理粘贴? [复制]

    这个问题在这里已经有答案了 可能的重复 如何在 jQuery 中处理 oncut oncopy 和 onpaste jQuery 捕捉粘贴输入 我有一个文本区域 粘贴到我想要的文本区域 设置粘贴值的格式 附加到文本区域 这可以用 JavaS
  • 嵌套 ng-repeat 中的 Angularjs ng-class-odd

    我正在尝试开发一个非常通用的表格输出器 没有设定的行数或列数 因此 我有嵌套的 ng repeat 属性 如下所示 table tr td printCell row col td tr table 效果很好 直到我尝试使用ng class