Angular: read all files from asset folder

2020-04-10 01:37发布

问题:

tltr: can I access the assets directory from angular?

I have a bunch of SVGs in a folder src/assets/icons that I use with mat-icon. The only drawback is when I add a new icon, I have to add the file and I have to add the filename to an array which I use to loop through for adding it to matIconRegistry. Is there a way to simply read all files from the directory?

Here's my current solution:

@NgModule()
export class CustomIconModule {
  constructor(
    private matIconRegistry: MatIconRegistry,
    private domSanitizer: DomSanitizer
  ) {
    const icons = [
      'icon1', 'icon2',
    ];

    for (const icon of icons) {
      this.matIconRegistry.addSvgIconInNamespace(
        'my-namespace',
        icon,
        domSanitizer.bypassSecurityTrustResourceUrl(`./assets/icons/${icon}.svg`)
      );
    }
  }
}

UPDATE: I wrote a bash script, that loops through the file, generates a .ts file with an array of all the filenames and does git add. I run it in the pre-commit git hook. not ideal, but it kinda works for now. I would love to find a pure JS solution, though.