How to use new Angular 20 inject syntax with

I'm using @Inject(String) to enable giving config at the instantiation of my service.

Here's the code:

const httpLoaderFactory: (http: HttpClient) => TranslateHttpLoader = (http: HttpClient) =>
new TranslateHttpLoader(http, "./i18n/", ".json");

export const appConfig: ApplicationConfig = {
providers: [
provideTranslateService({
loader: {
provide: TranslateLoader,
useFactory: httpLoaderFactory,
deps: [HttpClient],
},
}),
],
};



And this is the constructor of my TranslateHTTPLoader class:

constructor(
private http: HttpClient,
@Inject(String) public prefix = "/assets/i18n/",
@Inject(String) public suffix = ".json",
) {}


Angular 20 ESLint now wants me to write it as follows:

http = inject(HttpClient)


But this won't take the element from the constructor. Is it a way of doing it properly?

I'm already disabling the ESLint errors using:

// eslint-disable-next-line @angular-eslint/prefer-inject
private http: HttpClient,

Continue reading...