How to make data in typescript?

I'm currently trying to make a create function but there are some problems.

So first i made an input in the .html file.

<ng-template #formFieldTemplate let-form="form" let-field="field" let-label="label" let-fullwidth="fullwidth ?? true">
    <mat-form-field [class.fullwidth]="fullwidth" [formGroup]=form *ngIf="form.get(field) as _field" appearance="fill">
        <mat-label>{{label ?? field}}</mat-label>
        <input [id]="field" matInput type="text" [formControlName]="field">
    </mat-form-field>
</ng-template>

<form [formGroup]="newquoteform" (ngSubmit)="submitquote()" >
  <table mat-table [dataSource]="quotes | keyvalue" class="mat-elevation-z8" style="width: 100%;">
      <ng-container matColumnDef="quote">
        <th mat-header-cell *matHeaderCellDef> quote </th>
        <td mat-footer-cell *matFooterCellDef>
          <ng-container *ngTemplateOutlet="formFieldTemplate;context:{form: newquoteform, field: 'quote'}"></ng-container>
        </td>
      </ng-container>
  <ng-container matColumnDef="Delete">
    <th mat-header-cell *matHeaderCellDef></th>
    <td mat-footer-cell *matFooterCellDef>
      <button mat-icon-button class="small colored accent">
        <mat-icon>add</mat-icon>
      </button>
    </td>
  </ng-container>
  <tr mat-header-row *matHeaderRowDef="columns"></tr>
  <tr mat-row *matRowDef="let row; columns: columns;"></tr>
  <tr mat-footer-row *matFooterRowDef="columns"></tr>
</table>
</form>

Then i made a .ts file with a function that would react to it:

submitquote() {
        const quote = this.newquoteform.value as quote
        const quoteIDs = Object.keys(this.quotes);
        let id = (quote.quote).replace(/\s/g, "")
    
        if (quoteIDs.indexOf(id) !== -1) {
          let i = 2;
          while (quoteIDs.indexOf(id + i) !== -1) i++;
          id = id + i;
        }
    
        this.quotes[id] = quote;
        this.quotes = {...this.quotes}
    
        this.newquoteform.reset();
      }

Also in the same file i put:

public quotes !: Record<string, quote>;
public columns = ['quote','Delete'];
public newquoteform = new FormGroup({
    quote: new FormControl(null, Validators.required)
  })

This is supposed to create a new quote but this doesn't work because the function tries to use the keys from all the quotes to make a new id for the new quote, but there are no previous quotes.

So i tried to make something so that there is already a quote before i even do anything.

This is the .ts file that makes me the interface quote and i tried to make it so that it has two quotes already:

interface QuoteData {
    quote : string;
}

export interface quote extends  QuoteData{
     "quote1": string, "quote2": string
}

But after i use npm build it and it makes a dist/quote.js file(this is the file that's connected with the server) it doesn't make something in the database.

The file quote.js:

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });

Any idea i can use to make it so that there is always a quote?