Loading icons from asset folder in a page in angular project showing 429 error

In my angular project, under assets folder I have some svg icons. I need to show those icons in the dropdown list beside of each item. Here is my code to show the icons:

constructor(		
		private matIconRegistry: MatIconRegistry,
		private domSanitizer: DomSanitizer		
	) {
		
		this.registerIcon();
	}
	

registerIcon() {
		this.matIconRegistry.addSvgIcon("1", this.domSanitizer.bypassSecurityTrustResourceUrl("assets/icons/text.svg"));
		this.matIconRegistry.addSvgIcon("2", this.domSanitizer.bypassSecurityTrustResourceUrl("assets/icons/text.svg"));
		this.matIconRegistry.addSvgIcon("4", this.domSanitizer.bypassSecurityTrustResourceUrl("assets/icons/select.svg"));
		this.matIconRegistry.addSvgIcon("5", this.domSanitizer.bypassSecurityTrustResourceUrl("assets/icons/radio.svg"));
		this.matIconRegistry.addSvgIcon("6", this.domSanitizer.bypassSecurityTrustResourceUrl("assets/icons/checkbox.svg"));
		this.matIconRegistry.addSvgIcon("7", this.domSanitizer.bypassSecurityTrustResourceUrl("assets/icons/date.svg"));		
	}	

Html code:

<mat-form-field>
	<mat-label>Field Type</mat-label>
	<mat-select [(ngModel)]="field.fieldType" [ngModelOptions]="{standalone: true}">
		<mat-select-trigger>
			<mat-icon svgIcon="{{field.fieldType}}"></mat-icon>
			 {{selectedFieldName}}
		</mat-select-trigger>
		<mat-option *ngFor="let item of allFieldTypes" [value]="item.value">
			<mat-icon class="material-icons" svgIcon="{{item.value}}"></mat-icon>
			{{item.viewValue}}
		</mat-option>
	</mat-select>
</mat-form-field>

While runing the project in my local Environment, it's working fine and I can see the icons in the dropdown list. But when I deploy the code to the AWS Cloud, the code is not working and I can see the 429 error for each icons.

Can anyone tell me how to fix the problem?

you seem to have wrong configuration for this service,
here's an update service
and here's folder structure
folder structure

and output here
output

import { Injectable } from '@angular/core';
import { DomSanitizer } from '@angular/platform-browser';
import { MatIconRegistry } from '@angular/material/icon';

@Injectable({
  providedIn: 'root'
})
export class IconService {

  constructor(
    private _iconRegistry: MatIconRegistry,
    private _sanitizer: DomSanitizer
  ) {}
  public registerIcons(icons: Array<string>): void {
    icons.forEach((icon) => {

      this._iconRegistry.addSvgIcon(
        icon,
        this._sanitizer.bypassSecurityTrustResourceUrl(
          `assets/icons/${icon}.svg`
        )
      );
    });
  }
}

for app.module.ts

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { IconService } from './services/icon.service';
import { MatIconModule } from '@angular/material/icon';
import { HttpClientModule } from '@angular/common/http';
import { MatSelectModule } from '@angular/material/select';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    MatIconModule,
    BrowserAnimationsModule,
    HttpClientModule,
    FormsModule,
    MatSelectModule,
    ReactiveFormsModule
  ],
  providers: [IconService],
  bootstrap: [AppComponent]
})
export class AppModule { }

FOR app.component.ts

import { Component, OnInit } from '@angular/core';
import { IconService } from './services/icon.service';

export class AppComponent implements OnInit {
  title = 'app-icons';
  icon: string = 'soc-icon';

  allFieldType=[];

  field:any

  constructor(private _iconService: IconService) {
    this.field = {
      value: this.icon,
      viewValue: 'Text',
    };
    this.allFieldTypes = [
      { value: this.icon, viewValue: 'Text' },
      { value: this.icon, viewValue: 'Number' },
      { value: this.icon, viewValue: 'Date' },
     
    ];
  }
  ngOnInit(): void {
    this._iconService.registerIcons([this.icon]);
  }

for app.compnent.html

  <h1>hello SVG icon</h1>

  <div>
    <mat-form-field>
      <mat-label>Select a field type</mat-label>
      <mat-select [(ngModel)]="field">
        <mat-select-trigger>
          <mat-icon svgIcon="{{field.value}}"></mat-icon>
           {{field.viewValue}}
        </mat-select-trigger>
        <mat-option *ngFor="let item of allFieldTypes" [value]="item">
          <mat-icon class="material-icons" svgIcon="{{item.value}}"></mat-icon>
          {{item.viewValue}}
        </mat-option>
      </mat-select>
    </mat-form-field>
  </div>