Angular js ng repeat与条件ng类不应用css类

Angular js ng repeat with conditional ng class not applying css class

本文关键字：ng 应用 css js repeat Angular 条件      更新时间：2024-06-22

如果我的css类的名称中有连字符，则我有一个与不应用css类的ng类重复的ng：

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

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

对我来说，您的代码可以按原样运行。

下面是一个演示代码的plunker。

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;
}
相关文章：