subscriptsizing for standalone components in Angular 18

Hi I'm trying to reduce spacing between items in an Angular 18 reactive form. I've seen an answer using subscriptSizing for modules here on stackoverflow at:

How to remove space bottom mat-form-field.

Does anyone know how to change the subscriptSizing to 'dynamic' for standalone components? I've tried adding in main.ts and in the app.config.ts but having no luck.

Thanks

Pete

/*main.ts:*/
/*************only accepts two arguments*************/
bootstrapApplication(AppComponent, appConfig,)
.catch((err) => console.error(err));

/*app.config.ts*/
/***doesnt recognize MAT_FORM_FIELD_DEFAULT_OPTIONS --tried importing MatFormFieldModule***/
export const appConfig: ApplicationConfig = {
providers: [provideZoneChangeDetection({ eventCoalescing: true }), provideRouter(routes),
provideAnimationsAsync(),provideHttpClient(), {provide: MAT_FORM_FIELD_DEFAULT_OPTIONS,
useValue:{subscriptSizing: 'dynamic'}}
]
};

Continue reading...