I'm trying to copy a text when a button is clicked. I tried following Angular's documentation (https://material.angular.io/cdk/clipboard/overview#programmatically-copy-a-string) but my terminal is giving me the following error when compiling:
Property 'copy' does not exist on type 'Clipboard'
Here's my .ts file:
export class myComponent implements OnInit {
constructor(private clipboard: Clipboard) {}
ngOnInit(): void {}
copyTest() {
this.clipboard.copy("test"); // Property 'copy' does not exist on type 'Clipboard'.
}
}
Here's my .html file:
<button [cdkCopyToClipboard]="copyTest()">Click to copy</button>
And here's my app.module.ts file:
import { ClipboardModule } from "@angular/cdk/clipboard";
@NgModule({
declarations: [
AppComponent,
myComponent,
],
imports: [
ClipboardModule,
]
})
Any ideas why this error is occurring?
You must be missing the correct import for Clipboard.
Try adding: import { Clipboard } from '@angular/cdk/clipboard'; to your .ts file as well as your app.module.ts.
There is an interface Clipboard as well which your IDE probably accepts as valid TS.
Try this instead:
<button [cdkCopyToClipboard]="copyTest('Test!')">Click to copy</button>
copyTest(test: string) {
this.clipboard.copy(test);
}