使用angular-js中的id突出显示一行表

时间:2017-09-11 05:47:34

标签: javascript jquery html css angularjs

我是{include file='../cart_rules/informations.tpl'}的新手。我有一张像 -

的桌子

HTML

angularjs

所以,现在我有一个来自<table class="table table-striped" id="manageResumeTable"> <thead class="text-center text-info text-capitalize"> <th class="text-center col-xs-1">Sr.No.</th> <th class="text-center col-xs-4">Document</th> <th class="text-center col-xs-1">Score</th> <th class="text-center col-xs-1">QuickScore</th> <th class="text-center col-xs-5">Actions</th> </thead> <tr ng-repeat="file in processResumeFiles"> <td class="text-center col-xs-1">{{ file.temporaryId }}</td> <td class="view-orphan uploadResumeTableCellOverFlow col-xs-4"> {{ file.attributes.name }} </td> <td class="text-center col-xs-1">{{file.totalScore}}</td> <td class="text-center col-xs-1">{{file.attributes.quickScore}}</td> <td class="text-center col-xs-5"> <button class="btn btn-labeled btn-info" title="Annotate Un-annotated Words" ng-disabled="!file.attributes.isUploadedDocument" data-ng-click="getOrphans($index)"> <i class="fa fa-eye" aria-hidden="true"></i> </button> <button class="btn btn-labeled btn-info" title="Promote to Gold Standard" ng-disabled="!file.attributes.isCommitted || !file.attributes.isUploadedDocument" data-ng-click="markAsGoldStd(file.attributes.name)"> <i class="fa fa-share" aria-hidden="true"></i> </button> <button class="btn btn-labeled btn-info" title="Delete from Corpus" data-ng-click="deleteResume(file.attributes.name)"> <i class="fa fa-trash" aria-hidden="true"></i> </button> <button class="btn btn-labeled btn-info" title="Move to Archive" ng-disabled="!file.attributes.isCommitted || !file.attributes.isUploadedDocument" data-ng-click="moveToSolar(file.attributes.name)"> <i class="fa fa-sign-out" aria-hidden="true"></i> </button> <button class="btn btn-labeled btn-info" title="Add to Tracker" ng-disabled="!file.attributes.isCommitted || !isjdDeleted || !jdSelected" data-ng-click="moveToJobDescription(file.attributes.name)"> <i class="fa fa-check-square" aria-hidden="true"></i> </button> </td> </tr> </table> 的id。我想突出显示back-end行。 id is 1

表数据类似于 -

Sr.No文档评分QuickScore操作 1 abc 12 5 aa

此处,当ID为Temporary Id is the ID here时,我想突出显示该行。任何人都可以给我任何想法吗?谢谢你的帮助。

2 个答案:

答案 0 :(得分:1)

您可以使用ngClass directive将CSS类添加到<TR>

<tr ng-repeat="file in processResumeFiles"  ng-class="{'highlighterClass' : file.temporaryId == 1}">

答案 1 :(得分:0)

实际的突出显示应该通过CSS完成。因此,您的角度代码应该只是将要突出显示的行上的调用设置为CSS代码可以理解并突出显示的内容