### File

`src/lib/copy-to-clipboard-button/copy-to-clipboard-button.component.ts`

### Metadata

changeDetection | `ChangeDetectionStrategy.OnPush`
selector | `rxap-copy-to-clipboard-button`
imports | `MatButtonModule` `ClipboardModule` `MatIconModule` `MatSnackBarModule`
styleUrls | `./copy-to-clipboard-button.component.scss`
templateUrl | `./copy-to-clipboard-button.component.html`

### Index

###### Methods

- Public copied

###### Inputs

- value

### Constructor

`constructor(snackbar: MatSnackBar)`
Defined in src/lib/copy-to-clipboard-button/copy-to-clipboard-button.component.ts:29

Parameters :

Name | Type | Optional
snackbar | `MatSnackBar` | No

### Inputs

value
Type : `string`
Default value : `''`
Defined in src/lib/copy-to-clipboard-button/copy-to-clipboard-button.component.ts:29

### Methods

Public copied
`copied()`
Defined in src/lib/copy-to-clipboard-button/copy-to-clipboard-button.component.ts:34
Returns : `void`

    import {
      ChangeDetectionStrategy,
      Component,
      Inject,
      Input,
    } from '@angular/core';
    import {
      MatSnackBar,
      MatSnackBarModule,
    } from '@angular/material/snack-bar';
    import { MatIconModule } from '@angular/material/icon';
    import { ClipboardModule } from '@angular/cdk/clipboard';
    import { MatButtonModule } from '@angular/material/button';

    @Component({
        selector: 'rxap-copy-to-clipboard-button',
        templateUrl: './copy-to-clipboard-button.component.html',
        styleUrls: ['./copy-to-clipboard-button.component.scss'],
        changeDetection: ChangeDetectionStrategy.OnPush,
        imports: [
            MatButtonModule,
            ClipboardModule,
            MatIconModule,
            MatSnackBarModule,
        ]
    })
    export class CopyToClipboardButtonComponent {
      @Input()
      public value = '';

      constructor(@Inject(MatSnackBar) private readonly snackbar: MatSnackBar) {
      }

      public copied() {
        this.snackbar.open('Erfolgreich in die Zwischenablage kopiert.', 'OK', {
          duration: 2500,
        });
      }
    }

    <button
      (cdkCopyToClipboardCopied)="copied()"
      (click)="$event.stopPropagation()"
      [cdkCopyToClipboard]="value"
      mat-icon-button
      type="button"
    >
      <mat-icon>content_copy</mat-icon>
    </button>

`./copy-to-clipboard-button.component.scss`

Legend
Html element
Component
Html element with directive

# results matching ""

# No results matching ""