projects/cobbler-frontend/src/app/common/dialog-item-copy/dialog-item-copy.component.ts

Metadata

Relationships

Used by

No results matching.

Depends on

Index

Properties
Methods
Inputs
Outputs

Inputs

dialogCloseSignal
Type : string
Default value : ''

Outputs

dialogCloseSignal
Type : string

Methods

onNoClick
onNoClick()
Returns : void

Properties

data
Type : unknown
Default value : inject<DialogItemCopyData>(MAT_DIALOG_DATA)
Readonly dialogRef
Type : unknown
Default value : inject(MatDialogRef<DialogItemCopyComponent>)
import {
  ChangeDetectionStrategy,
  Component,
  inject,
  model,
} from '@angular/core';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { MatButtonModule } from '@angular/material/button';
import {
  MAT_DIALOG_DATA,
  MatDialogModule,
  MatDialogRef,
} from '@angular/material/dialog';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatInputModule } from '@angular/material/input';

export interface DialogItemCopyData {
  itemType: string;
  itemName: string;
  itemUid: string;
}

@Component({
  selector: 'cobbler-dialog-item-copy',
  imports: [
    MatDialogModule,
    MatButtonModule,
    ReactiveFormsModule,
    MatFormFieldModule,
    MatInputModule,
    FormsModule,
  ],
  templateUrl: './dialog-item-copy.component.html',
  styleUrl: './dialog-item-copy.component.scss',
  changeDetection: ChangeDetectionStrategy.OnPush,
})
export class DialogItemCopyComponent {
  data = inject<DialogItemCopyData>(MAT_DIALOG_DATA);

  readonly dialogRef = inject(MatDialogRef<DialogItemCopyComponent>);
  readonly dialogCloseSignal = model('');

  onNoClick(): void {
    this.dialogRef.close();
  }
}
<h1 mat-dialog-title i18n="@@dialog.copy.title">Copy {{ data.itemType }}</h1>
<mat-dialog-content>
  <mat-form-field class="form-field-full-width">
    <mat-label i18n="@@dialog.copy.label.old-name">Old name</mat-label>
    <input matInput readonly value="{{ data.itemName }}" />
  </mat-form-field>

  <mat-form-field class="form-field-full-width">
    <mat-label i18n="@@dialog.copy.label.new-name">New name</mat-label>
    <input
      matInput
      [(ngModel)]="dialogCloseSignal"
      cdkFocusInitial
      placeholder="New name"
      i18n-placeholder="@@dialog.copy.placeholder.new-name"
    />
  </mat-form-field>
</mat-dialog-content>
<mat-dialog-actions>
  <button mat-button (click)="onNoClick()" i18n="@@button.close">Close</button>
  <button
    mat-button
    [mat-dialog-close]="dialogCloseSignal()"
    i18n="@@dialog.copy.button.copy"
  >
    Copy
  </button>
</mat-dialog-actions>

./dialog-item-copy.component.scss

.form-field-full-width {
  width: 100%;
}
Legend
Html element
Component
Html element with directive

results matching ""

    No results matching ""