0 Tage Serie
javascript / intermediate
Snippet

Sichere DOM-Manipulation mit Renderer2

Der direkte Zugriff auf das DOM über 'nativeElement' kann gefährlich sein und bricht die Kompatibilität mit Nicht-Browser-Plattformen (wie SSR). Renderer2 bietet eine sichere Abstraktionsschicht zum Ändern von Styles, Attributen und Klassen.

snippet.js
javascript
1
2
3
4
5
constructor(private renderer: Renderer2, private el: ElementRef) {}
highlight() {
this.renderer.addClass(this.el.nativeElement, 'active');
}
angular
Erklärung
1
private renderer: Renderer2
Injiziert den Angular-Renderer-Dienst für plattformübergreifende sichere DOM-Interaktionen.
2
this.renderer.addClass(...)
Wendet sicher eine CSS-Klasse auf ein Element an, ohne direkte Eigenschaftsmanipulation.