@qrsln/highlighter

Highlighter

For Angular

Html

<div class="card card-body mb-2">
  <label for="TypeScript">TypeScript</label>
  <textarea id="TypeScript" lbHighlighter [theme]="'default'" [lineNumbers]="true">
            class MyClass {
              public static myValue: string;
              constructor(init: string) {
                this.myValue = init;
              }
            }  
        </textarea>
</div>
<!--OR-->
<div class="card card-body mb-2">
  <label for="TypeScript">TypeScript</label>
  <textarea id="TypeScript" lbHighlighter [theme]="'default'" [code]="TS_Sample" [lineNumbers]="true"></textarea>
</div>

Ts

TS_Sample = `
class MyClass {
  public static myValue: string;
  constructor(init: string) {
    this.myValue = init;
  }
}
import fs = require("fs");
module MyModule {
  export interface MyInterface extends Other {
    myProperty: any;
  }
}
declare magicNumber number;
myArray.forEach(() => { }); // fat arrow syntax
  `;

Features

Params	desc
[theme]	highlight.js theme classes [default: 'vs2015']
[code]	code here or innerHTML [if code not set it will look innerHTML]
[lineNumbers]	Line Numbers [default: false]
[lang]	code language here [no need]
[options]	highlight.js options

app.module.ts

import {HighlighterModule} from '@qrsln/highlighter';

@NgModule({
  imports: [HighlighterModule, ...],