search

Home  >  Q&A  >  body text

javascript - angularjs ng-repeat 循环不同的样式

我想实现 跳转按钮是红色,删除按钮是蓝色,添加是白色,但是目前这样循环的话,全是“btn-warning”这个样式,也就是红色!

angular.module('demoAPP').controller('demoCtrl', function($scope) {
  var demoData = [
    {
      "Name" : "操作",
      "action" : "跳转"
    },
    {
      "Name" : "操作",
      "action" : "删除"
    }
    {
      "Name" : "操作",
      "action" : "添加"
    }
  ]
  $scope.demo = demoData;
    });

<table>
    <tr ng-repeat="item  in demo">
      <td>{{item.Name}}</td>
      <td><button type="button" class="btn btn-warning">{{item.action}}</button></td>
    </tr>  
</table>
给我你的怀抱给我你的怀抱2743 days ago651

reply all(3)I'll reply

  • 伊谢尔伦

    伊谢尔伦2017-05-15 17:15:42

    ng-class should do the trick.

    reply
    0
  • 过去多啦不再A梦

    过去多啦不再A梦2017-05-15 17:15:42

    ng-class="{'Style':item.action=='Jump'}"
    ng-class="{'Style':item.action=='Add'}"
    ng-class="{ 'Style':item.action=='Modify'}"
    Execute style when ng-class is true

    reply
    0
  • 我想大声告诉你

    我想大声告诉你2017-05-15 17:15:42

    Multiple styles in ng-class are separated by commas, and write all three judgments in the repetition.

    reply
    0
  • Cancelreply