How to highlight each line using ACE Editor in Angular TypeScript?

Issue

I use ACE Editor in my Angular5 project.
As you can see I want to validate allow and deny email in the editor.
I want to highlight each line that is duplicated.
ACE Editor can be highlighted each line like that?
Please see
this picture

Solution

Use the addMarker to add highlight to the lines you want to show a highlight.

Range = ace.require('ace/range').Range;
editor.session.addMarker(
    new Range(from, start_pos, to, end_pos), 
    "show-highlight", 
    "fullLine");

Here start_pos and end_pos are the lines you would like to highlight. Add CSS to the class “show-highlight”

.show-highlight {
  position:absolute;
  background: yellow; //Specify the color you would like to use
}

Answered By – Harsha pps

Answer Checked By – Terry (AngularFixing Volunteer)

Leave a Reply

Your email address will not be published.