How to apply bold style in angular

I'm trying to make an editor by myself the first step is to add the Bold style. but I don't understand how to do it. I use the bold() method but it doesn't work.

thanks in advance.

html

<div class="content">
  <!-- toolbar -->
  <div class="toolbar-content">
    <!-- bold -->
    <span (click)="addBoldStyle()">
      <mat-icon>format_bold</mat-icon>
    </span>
  </div>
</div>

<!-- textarea -->
<form [formGroup]="form">
  <div class="textarea">
    <mat-form-field appearance="outline" style="width: 470px;">
      <mat-label>textarea</mat-label>
      <textarea #text matInput formControlName="editor" rows="5" style="border-radius: 5px"></textarea>
    </mat-form-field>
  </div>
</form>

ts.file

  @ViewChild('text') public textarea: ElementRef;

  public form: FormGroup;

  constructor(private fb: FormBuilder) {}

  ngOnInit(): void {
    this.createForm();
  }

  createForm() {
    this.form = this.fb.group({
      editor: null,
    });
  }

  addBoldStyle() {
    console.log('bold');
    this.textarea.nativeElement.innerHTML.bold();
  }