javascript - angularjs ng-repeat 循環(huán)不同的樣式
問(wèn)題描述
我想實(shí)現(xiàn) 跳轉(zhuǎn)按鈕是紅色,刪除按鈕是藍(lán)色,添加是白色,但是目前這樣循環(huán)的話,全是“btn-warning”這個(gè)樣式,也就是紅色!
angular.module(’demoAPP’).controller(’demoCtrl’, function($scope) { var demoData = [ { 'Name' : '操作', 'action' : '跳轉(zhuǎn)' }, { '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>
問(wèn)題解答
回答1:ng-class應(yīng)該可以搞定。
回答2:ng-class='{’樣式’:item.action==’跳轉(zhuǎn)’}'ng-class='{’樣式’:item.action==’添加’}'ng-class='{’樣式’:item.action==’修改’}'ng-class為true時(shí)執(zhí)行樣式
回答3:ng–class中多個(gè)樣式用逗號(hào)隔開,在重復(fù)里面把三個(gè)判斷都寫上。
相關(guān)文章:
1. Docker for Mac 創(chuàng)建的dnsmasq容器連不上/不工作的問(wèn)題2. docker安裝后出現(xiàn)Cannot connect to the Docker daemon.3. css - 定位為absolute的父元素中的子元素 如何設(shè)置在父元素的下面?4. javascript - angualr2中emit觸發(fā)一個(gè)方法然后怎么獲得這個(gè)promise的結(jié)果5. java - 請(qǐng)問(wèn)在main方法中寫成對(duì)象名.屬性()并賦值,與直接參參數(shù)賦值輸錯(cuò)誤是什么原因?6. mysql里的大表用mycat做水平拆分,是不是要先手動(dòng)分好,再配置mycat7. java - Spring boot 讀取 放在 jar 包外的,log4j 配置文件,系統(tǒng)有創(chuàng)建日志文件,不寫入日志信息。8. javascript - 圖片鏈接請(qǐng)求一直是pending狀態(tài),導(dǎo)致頁(yè)面崩潰,怎么解決?9. python - beautifulsoup獲取網(wǎng)頁(yè)內(nèi)容的問(wèn)題10. 怎么用css截取字符?
