I am trying to color specific lines using code-prettify. I am getting data from my backend in terms of line numbers and want to highlight them. If I write this in my css file:
#file2 li:nth-child(n+1):nth-child(-n+11) {
background: #18b478;
}
it's working fine. But, I cant figure out how to implement this using angular, where I want to dynamically do changes to the CSS according to the line numbers I am getting. This is what I have tried:
$("#file2 li:nth-child(n+1):nth-child(-n+11)").css('background', "#18b478");
This is my html code:
<div class="container" style="margin-bottom: 50px">
<div class="col-sm-6">
<pre>
<code class="prettyprint linenums" id="file1">***some code***</code>
</pre>
</div>
Imagine you have the line colors in an array. (With a length of the line count) And you have your lines in another array.
$scope.lines = linesarray
$scope.colors = colorsarray
in the code
<pre>
<code ng-repeat="line in $scope.lines">
Line content: {{ line }}
Line number is: {{ $index }}
Associated color is: {{ colors[$index] }}
</code>
//make use of the $index that returns current index of the ng-repeat loop
</pre>
Hope this helps!
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.