feat(transloco): allow to provide multiple scopes via provideTranslocoScopes

Author: EricPoul

apps/transloco-playground/src/app/lazy-multiple-scopes/lazy-multiple-scopes.component.ts

@@ -7,8 +7,7 @@ import { TranslocoModule, provideTranslocoScope } from '@jsverse/transloco';
   templateUrl: './lazy-multiple-scopes.component.html',
   styleUrls: ['./lazy-multiple-scopes.component.scss'],
   providers: [
-    provideTranslocoScope({ scope: 'admin-page', alias: 'AdminPageAlias' }),
-    provideTranslocoScope({ scope: 'lazy-page', alias: 'LazyPageAlias' }),
+    provideTranslocoScope({ scope: 'admin-page', alias: 'AdminPageAlias' }, { scope: 'lazy-page', alias: 'LazyPageAlias' }),
   ],
   standalone: true,
   imports: [TranslocoModule],

docs/docs/tools/scope-lib-extractor.mdx

@@ -56,6 +56,18 @@ import {provideTranslocoScope} from "./transloco.providers";
 export class CoreModule {}
 ```
 
+We also can provide several scopes at once: 
+
+```ts title="core.module.ts"
+import {provideTranslocoScope} from "./transloco.providers";
+@NgModule({
+  declarations: [CoreComponent],
+  providers: [provideTranslocoScope('core', { scope: 'shared', alias: 'sharedAlias' })],
+  imports: [TranslocoModule]
+})
+export class CoreModule {}
+```
+
 Now, we can use the scope in our component:
 
 ```ts title="lib-core.component.html"

libs/transloco/src/lib/transloco.providers.ts

@@ -76,12 +76,12 @@ export function provideTranslocoLoader(loader: Type<TranslocoLoader>) {
   ]);
 }
 
-export function provideTranslocoScope(scope: TranslocoScope) {
-  return {
+export function provideTranslocoScope(...scopes: TranslocoScope[]) {
+  return scopes.map((scope) => ({
     provide: TRANSLOCO_SCOPE,
     useValue: scope,
     multi: true,
-  };
+  }));
 }
 
 export function provideTranslocoLoadingTpl(content: Content) {