Angular js ng 重复条件 ng 类不应用 css 类

2024-01-07

我有一个 ng 重复,它的 ng 类在我的 css 类名称中包含连字符的情况下不应用 css 类:

<li
  ng-repeat="item in items"
  ng-class="{'i-someclass' : item.Id > 10}">
  {{item .name}}
</li>

我做错了什么吗?如果我将 css 类名更改为 isomeclass ,它就可以工作。 AngularJS v1.0.7


对我来说,你的代码按原样工作。

这是一个笨蛋 http://plnkr.co/edit/pPd2aa?p=preview演示了代码。

js:

var app = angular.module('myApp', []);

app.controller('Ctrl', function($scope) {

  $scope.items = [

    { Id: 1, name: "item1" },
    { Id: 10, name: "item1" },
    { Id: 11, name: "item1" }
    ];

  });

html:

<html ng-app="myApp">

  <head>
    <script data-require="angular.js@*" data-semver="1.2.4" src="http://code.angularjs.org/1.2.4/angular.js"></script>
    <link rel="stylesheet" href="style.css" />
    <script src="script.js"></script>
  </head>

  <body ng-controller="Ctrl">
    <h1>Hello Plunker!</h1>
    <ul>
      <li
        ng-repeat="item in items"
        ng-class="{'i-someclass' : item.Id > 10}">
        {{item .name}}
      </li>
    </ul>
  </body>

</html>

css:

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

Angular js ng 重复条件 ng 类不应用 css 类 的相关文章

随机推荐

  • 在vue 3中观察父组件的子属性

    我想知道如何使用组合 api 观察 Vue 3 中父组件的子属性 我正在使用实验脚本设置 https github com vuejs rfcs blob script setup 2 active rfcs 0000 script set
  • Asp.NET MVC ModelBinder,获取Action方法

    我有一个自定义 ModelBinder 我想获得该操作 因为我想使用反射来获取操作的属性 所以操作名称是不够的 我的行动方法 MyAttribute public ActionResult Index ModelBinder typeof
  • 参数类型“Color”无法分配给参数类型“MaterialColor”?

    How can I use RGBO in primarySwatch PrimarySwatch 不是颜色 这是材质颜色 这意味着它是材质应用程序将使用的不同深浅的颜色 默认颜色为蓝色 更多阅读文章https dev to rohanjs
  • 如何在没有 SDK 的情况下“下载”Android Studio IDE?

    我已经安装了 Android SDK 最新版本和 Eclipse 但我也想尝试 Android Studio 我见过this https stackoverflow com questions 16582892 android studio
  • 打印友好的 ASP.NET MVC 3 视图

    我想创建 ASP NET MVC 3 视图的打印友好版本 我该怎么做 另外 如果我需要制作视图的几个部分的打印友好版本怎么办 Regards 我使用相同的视图 但有 2 个 CSS 文件 其中一个带有media screen 另一个与med
  • 如何将 Moose 对象序列化为 XML?

    我有一堆遗留模块想要转换为基于 Moose 的模块 这些模块当前具有 toXML 方法 这些方法是使用 XML LibXML 手动编码的 是否有模块或技术可以将 Moose 对象序列化为 XML 我看过 MooseX Storage 但它处
  • 在 Kubernetes 中禁用 cronjob

    我已经安排了一个应用程序作为CronJob在 Kubernetes 中 当代码发生变化时 我也会更改图像CronJob 我正在寻找一个可以禁用当前正在运行的选项CronJob并部署一个新的CronJob与最新的图像版本 我怎样才能禁用Cro
  • 如何根据位置(偶数或奇数)将一个 full=number 分成两组

    我需要将一个txt文件分成2个数组 txt 文件包含完整的数字 我可以不使用字符串吗 例如 对于输入 4 how many line 2 1 3 7 8 0 3 7 我想要数组 1 包含 一行中的第一个数字 2 3 8 3 数组 2 包含
  • 如何确保 rake 任务一次只运行一个进程

    我使用 crontab 在某个时间调用 rake 任务 例如 每 3 小时 我想确保当 crontab 准备好执行 rake 任务时 它可以检查 rake 任务是否正在运行 如果是这样就不要执行 这个怎么做 谢谢 我将把它留在这里 因为我认
  • 静态变量自身的初始化

    考虑以下代码示例 include
  • PyCharm 中的 numpy 问题

    我好像无法安装numpy到 PyCharm 我首先安装了最新的 Python 2 7 8 和 PyCharm 3 4 1 然后我安装了温Python在 PyCharm 中获取numpy and scipy包使用 文件 gt 默认设置 gt
  • Android studio 2020.3.1 检测到手机时 logcat 中没有可调试进程

    大家好 我的新版本有问题android studio 2020 3 1 and android studio 4 2 2 当我插入手机调试应用程序时 logcat可以检测到我的手机 但我无法选择进程 它说 no debuggable pro
  • 如何使用开源许可证[关闭]

    Closed 这个问题不符合堆栈溢出指南 help closed questions 目前不接受答案 我有点不确定开源许可的工作原理 如果我要选择特定的开源许可证 您实际上需要做什么才能使其适用于您的软件 我想这会比仅仅 声明 您要在 LG
  • vTiger Web服务“ACCESS_DENIED:执行该操作的权限被拒绝ID”

    我想通过 vTiger Web 服务添加 SalesOrder 我正在使用这个 vtwsclib 这是代码
  • 如何使用 Awesomium 将 JavaScript 结果返回到 C#?

    我创建了一个新的WPF项目 并添加了Awesomium 1 6 3 网页控制 http awesomium com download to it 然后 我将这段代码添加到MainWindow xaml cs private void web
  • 创建/编辑 PNG 图像的免费工具? [关闭]

    Closed 这个问题正在寻求书籍 工具 软件库等的推荐 不满足堆栈溢出指南 help closed questions 目前不接受答案 有没有可用于创建和编辑 PNG 图像的免费工具 画图网 http getpaint net 会充满热情
  • Laravel:与数组的额外字段同步

    我试图将数据保存在数据透视表中 并使用一个名为 数据 的额外字段 当我保存时我有这个数组 5 gt files 4 gt pictures 3 gt tags 1 gt thumbs 我的桌子看起来像这样 项目ID 选项 ID name 上
  • 带有多重选择的 kivy spinner 小部件

    我正在寻找 Spinner 类型 或类似的东西 的 kivy 小部件 最好在 python kv 文件中 例如 我可以在其中通过复选框选择多个项目 所选项目应在元组 中可用 在图片 start png 中您将找到起始情况 表单中有一个标签和
  • 应用程序进入前台后 viewDidAppear 不会再次触发

    我在 iPhone 应用程序代码中发现了一个问题 即 viewDidAppear 方法并不总是触发 当您启动应用程序时 事件将按预期触发 但是 如果我使用能够进行多任务处理的手机关闭应用程序并重新打开 我的 viewDidAppear 事件
  • Angular js ng 重复条件 ng 类不应用 css 类

    我有一个 ng 重复 它的 ng 类在我的 css 类名称中包含连字符的情况下不应用 css 类 li item name li 我做错了什么吗 如果我将 css 类名更改为 isomeclass 它就可以工作 AngularJS v1 0