
Security News
Open Source CAI Framework Handles Pen Testing Tasks up to 3,600× Faster Than Humans
CAI is a new open source AI framework that automates penetration testing tasks like scanning and exploitation up to 3,600× faster than humans.
ngx-highlight-js
Advanced tools
Angular for syntax highlighting with highlight.js
npm install --save ngx-highlight-js
Load the highlight.js and theme css in page.
<link rel="stylesheet" href="//cdn.jsdelivr.net/gh/highlightjs/cdn-release/build/styles/atom-one-dark.min.css" />
<script src="//cdn.jsdelivr.net/gh/highlightjs/cdn-release/build/highlight.min.js"></script>
import { Component } from '@angular/core';
import { HighlightJsDirective } from 'ngx-highlight-js';
@Component({
selector: 'test',
template: `<textarea highlight-js [lang]="'bash'">npm install --save ngx-highlight-js</textarea>`,
imports: [HighlightJsDirective]
})
export class SimpleComponent {}
<textarea highlight-js [options]="{}" [lang]="'typescript'">
/* tslint:disable */
import { Component } from '@angular/core';
@Component({
selector: 'demo',
templateUrl: './demo.component.html',
styleUrls: ['./demo.component.scss']
})
export class DemoComponent {
switchStatus: boolean = true;
}
</textarea>
Will render each <pre><code>
:
<textarea highlight-js mode="default">
<p>
The bare minimum for using highlight.js on a web page is linking to the library along with one of the styles and calling
<a href="http://highlightjs.readthedocs.io/en/latest/api.html#inithighlightingonload"><code>initHighlightingOnLoad</code></a
>:
</p>
<pre><code class="language-html"><link rel="stylesheet" href="/path/to/styles/default.css">
<script src="/path/to/highlight.min.js"></script>
<script>hljs.initHighlightingOnLoad();</script>
</code></pre>
<p>
This will find and highlight code inside of <code><pre><code></code> tags; it tries to detect the language automatically. If
automatic detection doesn’t work for you, you can specify the language in the <code>class</code> attribute:
</p>
<pre><code class="language-html"><pre><code class="html">...</code></pre>
</code></pre>
</textarea>
Property | Description | Type | Default | Global Config |
---|---|---|---|---|
[mode] | - default Will render each <pre><code> - simple Render all content according to lang language | default, simple | simple | ✅ |
[options] | Equar configure(options) | any | - | ✅ |
[lang] | Uses language detection by default but you can specify the language | string | html | ✅ |
[code] | Specify content | string | html | - |
Global Config
@NgModule({
providers: [provideHighlightJsConfig({ lang: 'html' })]
})
export class AppDemoModule {}
Please follow this guidelines when reporting bugs and feature requests:
Thanks for understanding!
The MIT License (see the LICENSE file for the full text)
FAQs
Angular for syntax highlighting with highlight.js
The npm package ngx-highlight-js receives a total of 1,685 weekly downloads. As such, ngx-highlight-js popularity was classified as popular.
We found that ngx-highlight-js demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
CAI is a new open source AI framework that automates penetration testing tasks like scanning and exploitation up to 3,600× faster than humans.
Security News
Deno 2.4 brings back bundling, improves dependency updates and telemetry, and makes the runtime more practical for real-world JavaScript projects.
Security News
CVEForecast.org uses machine learning to project a record-breaking surge in vulnerability disclosures in 2025.