Statut
Component checklist
Usage
<dsa-error-message-panel error-code="404">
<h3>Page non trouvée</h3>
<p slot="description">
La page que vous cherchez est introuvable. Excusez-nous pour la gêne
occasionnée. Pour continuer votre visite vous pouvez consulter notre
page d’accueil, ou effectuer une recherche avec notre moteur de
recherche en haut de page.
</p>
<dsa-button slot="action">Page d’accueil</dsa-button>
</dsa-error-message-panel>
<script type="text/typescript">
import '@ds-autonomie/web-components/dist/components/error-message-panel/error-message-panel.js';
import type { DSAErrorMessagePanel } from '@ds-autonomie/web-components/';
</script>
Exemple d'intégration du pied de page sur différents framework:
- app.component.html
<dsa-error-message-panel error-code="404">
<h3>Page non trouvée</h3>
<p slot="description">
La page que vous cherchez est introuvable. Excusez-nous pour la gêne
occasionnée. Pour continuer votre visite vous pouvez consulter notre
page d’accueil, ou effectuer une recherche avec notre moteur de
recherche en haut de page.
</p>
<dsa-button slot="action">Page d’accueil</dsa-button>
</dsa-error-message-panel>
- app.component.ts
import { Component } from '@angular/core';
import type { DSAErrorMessagePanel } from '@ds-autonomie/web-components';
import '@ds-autonomie/web-components/dist/components/error-message-panel/error-message-panel.js';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {}
API
Attributs et propriétés
|
Propriété attribut |
Description |
Type |
Valeur par défaut |
|
errorCode error-code
|
Le code de l'erreur à afficher |
string |
'' |
Méthodes
Slots
|
Nom |
Description |
|---|---|
|
(défaut) |
Le titre principal du message d’erreur |
|
description |
Le slot de la description plus détaillée de l’erreur |
|
action |
Le slot contenant une action à déclencher. Par exemple un bouton de redirection |
Événements