我正在使用 bootstrap 中的“table-striped”和 angularjs 中的“ng-class”来呈现表格。这个想法是显示条纹表格,当点击一行时,它会突出显示。
以下内容是由于在奇数行上“点击”而从 chrome 复制的。
<div class="table-responsive" id="Destination">
<table class="table table-striped" id="destinationTable">
<thead>
...
</thead>
<tbody>
<!-- ngRepeat: entity in destinations -->
<tr ng-repeat="entity in destinations" ng-click="setName()" ng-class="{'highlight' : destinationName == entity.name}" class="ng-scope highlight">
</tbody>
</table>
</div>
如你所见,"class="ng-scope highlight"已经由angularjs在那一行生成了,只是没有生效。
同样的代码对偶数行也能很好地工作,这对我来说也很奇怪。我没有看到奇数行点击和偶数行点击之间的 html 差异。
在“bootstrap.css”中,它有,
.table-striped > tbody > tr:nth-of-type(odd) {background-color: #f9f9f9;}
我想知道这个类是否用于覆盖我想要的“亮点”。
有什么办法可以解决吗?
最佳答案
我遇到了同样的问题,它似乎与表格 strip 化中的 css 有关。
解决方法是执行以下操作:
要么使用 ng-style 指令
在要显示的类属性的 css 中使用 !important(例如 background-color: #dff0d8 !important; 用于突出显示类)
第 1 项可能是进入此处的更好方法,但两者都应该有效。
关于javascript - Angular ng-class 和 bootstraps css,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33395839/