Angularjs ng repeat中的ng类:根据项参数确定的条件类名称

Angularjs ng repeat中的ng类:根据项参数确定的条件类名称,angularjs,angularjs-ng-repeat,ng-class,Angularjs,Angularjs Ng Repeat,Ng Class,在ng repeat中,我想根据一些项目参数设置ng类的类名 我想在每个中添加性别和年龄对应类的简单示例: <div ng-init="friends = [ {name:'John', age:25, gender:'boy'}, {name:'Jessie', age:30, gender:'girl'}, {name:'Johanna', age:28, gender:'girl'}, {name:'Joy', age:15, gender:'girl'}, {n

ng repeat
中,我想根据一些项目参数设置
ng类的类名

我想在每个
  • 中添加性别年龄对应类的简单示例:

    <div ng-init="friends = [
      {name:'John', age:25, gender:'boy'},
      {name:'Jessie', age:30, gender:'girl'},
      {name:'Johanna', age:28, gender:'girl'},
      {name:'Joy', age:15, gender:'girl'},
      {name:'Mary', age:28, gender:'girl'},
      {name:'Peter', age:95, gender:'boy'},
      {name:'Sebastian', age:50, gender:'boy'},
      {name:'Erika', age:27, gender:'girl'},
      {name:'Patrick', age:40, gender:'boy'},
      {name:'Samantha', age:60, gender:'girl'}
    ]">
      I have {{friends.length}} friends. They are:
      <input type="search" ng-model="q" placeholder="filter friends..." />
      <ul class="example-animate-container">
        <li class="animate-repeat" ng-repeat="friend in friends | filter:q" ng-class="friend.gender friend.name">
          [{{$index + 1}}] {{friend.name}} who is {{friend.age}} years old.
        </li>
      </ul>
    </div>
    
    
    我有很多朋友。他们是:
    
    • [{{$index+1}}]{{friend.name}}谁是{{friend.age}岁。
    不幸的是,它似乎不是那样工作的


    您知道如何简单地实现这一点吗?

    ng class
    如果您想添加多个类,例如:

    ng-class="[friend.gender, friend.name]"
    

    演示:
    ng class
    如果要添加多个类,也支持数组表示法,例如:

    ng-class="[friend.gender, friend.name]"
    

    演示:有什么问题吗?没错,谢谢您提供的Plunker示例@dfsq!我只是制作了这个简单的例子来复制我在一个更复杂的应用程序中遇到的bug,实际上并没有尝试这个例子。。。在我的应用程序中,实际上有几个类需要以相同的方式添加。这不起作用:
    ng class=“friend.gender friend.name”
    。普朗克:哦,我现在明白你的问题了。查看我的答案如何在这种情况下使用
    ngClass
    。用几个参数更新了我的帖子有什么问题?没错,谢谢您提供的Plunker示例@dfsq!我只是制作了这个简单的例子来复制我在一个更复杂的应用程序中遇到的bug,实际上并没有尝试这个例子。。。在我的应用程序中,实际上有几个类需要以相同的方式添加。这不起作用:
    ng class=“friend.gender friend.name”
    。普朗克:哦,我现在明白你的问题了。查看我的答案如何在这种情况下使用
    ngClass
    。用几个参数更新了我的帖子你是明星!非常感谢您的快速回答!!相应地更新了我的第一篇帖子。你是个明星!非常感谢您的快速回答!!相应地更新了我的第一篇文章。