Zum Inhalt
ANLEITUNG FÜR ANGULAR

Angular
barrierefrei machen.

So baust du das Barrierefreiheits-Menü von barrierex in Angular ein: Schritt für Schritt, mit 20-Sekunden-Video und ehrlichen Hinweisen, was Angular erlaubt.

35 Anleitungen35 kurze KlickvideosOhne externe Video-Embeds
Integrationen Frameworks

AngularScript-Einbindung

Quellen geprüft
2026-10-29
Vor dem Einbau kurz prüfen

Einbindung im gemeinsamen Layout. Nicht jede Version oder Hostingkonfiguration wurde live getestet. Nach Hydration über afterNextRender laden. Ältere Versionen benötigen einen geeigneten Browser-Lifecycle.

Deine 20-Sekunden-AnleitungStumm · mit Untertiteln

Eigene schematische Klickanleitung, keine Originalaufnahme des Anbieter-Dashboards. Bezeichnungen können je Tarif, Sprache oder Editor-Version abweichen.

SCHRITT FÜR SCHRITT

So verbindest du Angular

01

Widget herunterladen

Lade barrierex-widget.js herunter. Die Datei benötigt keine Zugangsdaten und kommuniziert nicht mit einem barrierex-Dienst.

02

public/barrierex-widget.js

Lege barrierex-widget.js unter public/barrierex-widget.js ab. Der Browser muss die Datei über die eigene Domain laden können.

03

Root-Komponente: afterNextRender

Öffne Root-Komponente: afterNextRender und füge den für Angular erzeugten Code einmal in das gemeinsame Layout ein.

04

Veröffentlichen & prüfen

Baue und veröffentliche deine Website. Prüfe die Lesehilfe auf zwei Unterseiten und bei Tastaturnavigation. Nutze anschließend den Installationscheck.

PASSEND ZU DEINER WEBSITE

Dein Einbaupaket.

Datei nach public/barrierex-widget.js kopieren. Bei Unterpfad-Deployments den Assetpfad anpassen.

Framework-Code
// In der bestehenden Root-Komponente ergänzen
import { afterNextRender } from '@angular/core';

// Im constructor():
afterNextRender(() => {
  if (document.querySelector('[data-barrierex-loader]')) return;
  const script = document.createElement('script');
  script.src = '/barrierex-widget.js';
  script.dataset.barrierexLoader = 'true';
  script.dataset.mode = 'floating';
  script.dataset.color = '#7051e8';
  script.dataset.position = 'right';
  document.head.append(script);
});
DER LETZTE SCHRITT

Ist dein Script angekommen?

Prüfe die veröffentlichte Seite. Wir suchen das Script im HTML und testen, ob die Datei erreichbar ist.

Die URL wird nicht gespeichert. Dieser Check ist kein Barrierefreiheitsnachweis.

Direkt zur Herstellerdokumentation

Menüpfade und Einschränkungen wurden aus öffentlichen Herstellerquellen recherchiert. Es wurden keine Installationen in fremden Kundenkonten vorgenommen.

Angular: Quelle 1
NICHT SICHER, WAS DAHINTERSTECKT?

Deine URL reicht
für einen ersten Hinweis.

Die Erkennung ist ein Vorschlag aus öffentlichen HTML-Merkmalen. Bitte bestätige die Plattform, bevor du etwas einbaust.