'How do I "connect" a Mat-Form-Field to a button so that when i press the button the form-field pops up?

I devinded animal-Group in my .ts but i need to make a button that adds a Animal-Group to the database. Im new to coding

<mat-toolbar color="primary">
  <span>Animal-Application</span>
</mat-toolbar>




<section>
  <div class="add-Animal-Group-Button">
    <button (click)="createAnimalGroup()" mat-raised-button color="primary">add-Animal-Group</button>
  </div>
  <div class="add-Animal-Button">
    <button mat-raised-button color="primary">Add-Animal</button>
  </div>
</section>


<mat-form-field floatLabel="always" >
  <mat-label>Animal Group</mat-label>
  <input matInput required>
</mat-form-field>


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source