ngx-datatables-net Modern Angular wrapper for DataTables.net

Renderers & XSS safety

DataTables writes cells as innerHTML and does NOT escape by default, an XSS sink. With withSafeDefaults() enabled, ngx-datatables-net escapes every column lacking a renderer (column 2 shows the payload as literal text). Column 3 opts into HTML via the DomSanitizer-backed hook (safe tags kept, scripts/onerror/onclick stripped). No alert ever fires.

NameNote, escaped by defaultNote, sanitized HTML

The note values contain <script>, onerror and onclick payloads. Column 2 (no renderer) is auto-escaped by withSafeDefaults() and shows the literal text; column 3 renders only the sanitised markup. The injected alert never executes.

// app.config.ts, escape every renderer-less column:
provideDataTables(withDefaultStyling(), withSafeDefaults())

private readonly safeHtml = injectSanitizedHtmlRenderer();

columns: ConfigColumns[] = [
  { title: 'Name', data: 'name' },
  // No render → auto-escaped by withSafeDefaults() (safe text).
  { title: 'Escaped', data: 'note' },
  // Opt-in HTML, routed through Angular DomSanitizer.
  { title: 'Sanitized', data: 'note',
    render: this.safeHtml<Person>(row => row.note) },
];