File

src/lib/message-http-error/message-http-error.component.ts

Implements

IErrorDialogComponent

Metadata

Index

Properties

Properties

Public Readonly error
Type : MessageHttpErrorDialogData
Default value : inject(RXAP_ERROR_DIALOG_ERROR)
Public Readonly isProduction
Type : boolean
Default value : inject(RXAP_ENVIRONMENT, { optional: true })?.production ?? false
Public Readonly showMore
Default value : signal(false)
import { NgIf } from '@angular/common';
import {
  ChangeDetectionStrategy,
  Component,
  inject,
  signal,
} from '@angular/core';
import { RXAP_ENVIRONMENT } from '@rxap/environment';
import { AnyHttpErrorComponent } from '../any-http-error/any-http-error.component';
import { IErrorDialogComponent } from '../error-dialog/error-dialog.component';
import { RXAP_ERROR_DIALOG_ERROR } from '../tokens';
import { MessageHttpErrorDialogData } from './message-http-error-dialog-data';

@Component({
    selector: 'rxap-http-error-message',
    templateUrl: './message-http-error.component.html',
    styleUrls: ['./message-http-error.component.scss'],
    changeDetection: ChangeDetectionStrategy.OnPush,
    imports: [
        NgIf,
        AnyHttpErrorComponent,
    ]
})
export class MessageHttpErrorComponent implements IErrorDialogComponent<MessageHttpErrorDialogData> {

  public readonly isProduction: boolean = inject(RXAP_ENVIRONMENT, { optional: true })?.production ?? false;

  public readonly error: MessageHttpErrorDialogData = inject(RXAP_ERROR_DIALOG_ERROR);

  public readonly showMore = signal(false);

}
<div class="flex flex-col gap-2">
  <p class="text-xl">Http Error Message:</p>
  <p>{{ error.error.message }}</p>
  <ng-container *ngIf="!isProduction">
    <hr>
    <button (click)="showMore.set(true)"
            *ngIf="!showMore()"
            class="px-4 py-2 rounded bg-accent-500">
      <ng-container i18n>Show more details</ng-container>
    </button>
    <rxap-any-http-error *ngIf="showMore()"></rxap-any-http-error>
  </ng-container>
</div>

./message-http-error.component.scss

Legend
Html element
Component
Html element with directive

results matching ""

    No results matching ""