diff --git a/src/generators/SampleAssetsGenerator.ts b/src/generators/SampleAssetsGenerator.ts
index edf03f8..cb8deae 100644
--- a/src/generators/SampleAssetsGenerator.ts
+++ b/src/generators/SampleAssetsGenerator.ts
@@ -7,7 +7,7 @@ import { DependencyResolver } from "./../services/DependencyResolver";
import { LiveEditingFile, SAMPLE_APP_FOLDER, SAMPLE_SRC_FOLDER } from "./misc/LiveEditingFile";
import { TsImportsService } from "../services/TsImportsService";
import { componentPaths, appRouting } from "../services/TsRoutingPathService";
-import { IConfigGenerator, Config, ILiveEditingOptions } from "../public";
+import { IConfigGenerator, Config, ILiveEditingOptions, RoutesConfig } from "../public";
import { SampleDefinitionFile } from "./misc/SampleDefinitionFile";
const APP_MODULE_TEMPLATE_PATH = path.join(__dirname, "../templates/app.module.ts.template");
@@ -145,7 +145,7 @@ export class SampleAssetsGenerator {
));
sampleFiles.push(new LiveEditingFile(
SAMPLE_APP_FOLDER + "app.component.html",
- this._getAppComponentHtml(componentTsContent, config.usesRouting)));
+ this._getAppComponentHtml(componentTsContent, config.appConfig.routesConfig)));
sampleFiles.push(new LiveEditingFile(
`${SAMPLE_APP_FOLDER}app.config.ts`,
this._getAppConfig(config, configImports, configAdditionalImports),
@@ -251,16 +251,19 @@ export class SampleAssetsGenerator {
private _getAppComponentTs(config: Config, sampleFiles: LiveEditingFile[]) {
let appComponentTemplate = fs.readFileSync(APP_COMPONENT_TEMPLATE_PATH, "utf8");
const mainSampleTsPath = sampleFiles.filter(f => f.isMain && f.fileExtension === "ts")[0].path;
+ const importRouter = config.appConfig.routesConfig?.router ?? false;
return appComponentTemplate
.replace(/\{sampleAppComponent\}/g, config.component)
.replace(/\{appImport\}/g, `.\/${mainSampleTsPath.substring(mainSampleTsPath.indexOf("app/") + 4)}`)
+ .replace(/\{routerOutlet\}/g, importRouter ? ", RouterOutlet" : "")
+ .replace(/\{routerOutletImport\}/g, importRouter ? "import { RouterOutlet } from '@angular/router';" : "")
.replace(".ts", "");
}
- private _getAppComponentHtml(componentTsContent, usesRouting) {
+ private _getAppComponentHtml(componentTsContent, routesConfig?: RoutesConfig) {
let selectorRegex = /selector:[\s]*["']([a-zA-Z0-9-]+)["']/g;
let selectorComponent = selectorRegex.exec(componentTsContent)[1];
- let appComponentHtml = usesRouting ? "" :
+ let appComponentHtml = routesConfig?.router ? "" :
"<" + selectorComponent + ">" + selectorComponent + ">";
return appComponentHtml;
}
@@ -314,8 +317,9 @@ export class SampleAssetsGenerator {
}
});
}
- if (appConfig.router) {
+ if (this._shouldConfigureRouting(config)) {
importMap.set('@angular/router', ['provideRouter', 'withComponentInputBinding']);
+ importMap.set(`${appConfig.routesConfig.routesImportPath}`, ['routes']);
}
return importMap;
}
@@ -351,15 +355,20 @@ export class SampleAssetsGenerator {
formatted += ` ${provider}${i < providers.length - 1 ? ',\n' : ''}`;
});
}
- if (config.appConfig.router) {
+ if (this._shouldConfigureRouting(config)) {
if (formatted.length > 0) {
formatted += ',\n';
}
- formatted += ` provideRouter([], withComponentInputBinding())`;
+ formatted += ` provideRouter(routes, withComponentInputBinding())`;
}
return formatted;
}
+ private _shouldConfigureRouting(config: Config): boolean {
+ const routesConfig = config?.appConfig?.routesConfig;
+ return !!(routesConfig?.router && routesConfig?.routesImportPath);
+ }
+
private _getAppModuleConfig(config: Config, configImports, configAdditionalImports?) {
let defaultNgDeclarations = ["AppComponent"];
let defaultNgImports = ["BrowserModule", "BrowserAnimationsModule", "FormsModule"];
diff --git a/src/public.ts b/src/public.ts
index 19cafdc..868ed35 100644
--- a/src/public.ts
+++ b/src/public.ts
@@ -39,13 +39,12 @@ export class AppModuleConfig {
export interface AppConfig {
modules: ModuleProvider[];
providers: Provider[];
- router?: boolean;
+ routesConfig?: RoutesConfig;
additionalAdjustments?: string[];
}
export class Config {
public component: string;
- public usesRouting: boolean;
public additionalFiles: string[];
public appModuleConfig?: AppModuleConfig;
public appConfig: AppConfig;
@@ -106,3 +105,7 @@ export interface Provider {
import: string
}
+export interface RoutesConfig {
+ router?: boolean;
+ routesImportPath?: string;
+}
diff --git a/src/templates/app.component.ts.template b/src/templates/app.component.ts.template
index 0c7a514..69342eb 100644
--- a/src/templates/app.component.ts.template
+++ b/src/templates/app.component.ts.template
@@ -1,10 +1,11 @@
import { Component } from "@angular/core";
import { {sampleAppComponent} } from "{appImport}";
+{routerOutletImport}
@Component({
selector: "app-root",
styleUrls: ["./app.component.scss"],
templateUrl: "./app.component.html",
- imports: [{sampleAppComponent}]
+ imports: [{sampleAppComponent}{routerOutlet}]
})
export class AppComponent {}
\ No newline at end of file