diff --git a/projects/ngx-quicklink/package.json b/projects/ngx-quicklink/package.json
index 1dfc385..3792a23 100644
--- a/projects/ngx-quicklink/package.json
+++ b/projects/ngx-quicklink/package.json
@@ -1,5 +1,11 @@
{
"name": "ngx-quicklink",
+ "homepage": "https://github.com/mgechev/ngx-quicklink",
+ "bugs": "https://github.com/mgechev/ngx-quicklink/issues",
+ "repository": {
+ "type": "git",
+ "url": "https://github.com/mgechev/ngx-quicklink.git"
+ },
"version": "0.4.1",
"peerDependencies": {
"@angular/common": "^15.0.0",
@@ -8,4 +14,4 @@
"dependencies": {
"tslib": "^2.3.0"
}
-}
\ No newline at end of file
+}
diff --git a/projects/ngx-quicklink/src/lib/quicklink-strategy.service.ts b/projects/ngx-quicklink/src/lib/quicklink-strategy.service.ts
index 9f9a673..4249d9d 100644
--- a/projects/ngx-quicklink/src/lib/quicklink-strategy.service.ts
+++ b/projects/ngx-quicklink/src/lib/quicklink-strategy.service.ts
@@ -53,13 +53,15 @@ const findPath = (config: Route[], route: Route): string => {
if (route && route.children) {
children = children.concat(route.children);
}
- children.forEach((r: Route) => {
- if (visited.has(r)) return;
- parent.set(r, el);
- config.push(r);
- });
}
+
+ children.forEach((r) => {
+ if (visited.has(r)) return;
+ parent.set(r, el);
+ config.push(r);
+ });
}
+
let path = '';
let current: Route | undefined = route;
diff --git a/projects/standalone-app/src/app/about.component.ts b/projects/standalone-app/src/app/about.component.ts
index dfcaf51..66cd371 100644
--- a/projects/standalone-app/src/app/about.component.ts
+++ b/projects/standalone-app/src/app/about.component.ts
@@ -1,9 +1,16 @@
import { Component } from '@angular/core';
+import { RouterModule } from '@angular/router';
+import { QuicklinkDirective } from 'ngx-quicklink';
@Component({
standalone: true,
+ imports: [RouterModule, QuicklinkDirective],
template: `
About component
+
+ SUB
+
+
`,
})
export default class AboutComponent {}
diff --git a/projects/standalone-app/src/app/app.component.less b/projects/standalone-app/src/app/app.component.less
new file mode 100644
index 0000000..6b69fad
--- /dev/null
+++ b/projects/standalone-app/src/app/app.component.less
@@ -0,0 +1,23 @@
+:host {
+ display: block;
+ padding: 24px;
+}
+
+.navigation {
+ display: flex;
+ flex-direction: row;
+ gap: 12px;
+ margin-bottom: 24px;
+
+ a {
+ color: black;
+ text-decoration: none;
+ }
+}
+
+.side {
+ position: absolute;
+ right: 0;
+ width: 20vw;
+ border: solid 1px;
+}
diff --git a/projects/standalone-app/src/app/app.component.ts b/projects/standalone-app/src/app/app.component.ts
index a2bed3f..c6b0e05 100644
--- a/projects/standalone-app/src/app/app.component.ts
+++ b/projects/standalone-app/src/app/app.component.ts
@@ -1,12 +1,44 @@
import { Component } from '@angular/core';
import { RouterModule } from '@angular/router';
+import { QuicklinkDirective } from 'ngx-quicklink';
@Component({
selector: 'app-root',
standalone: true,
- imports: [RouterModule],
+ styleUrls: ['./app.component.less'],
+ imports: [RouterModule, QuicklinkDirective],
template: `
+ Standalone Example
+
+
+
+
+
+ Side Outlet
+
+
`,
})
-export class AppComponent {}
+export class AppComponent {
+ primaryRoutePath: any[] = [];
+ secondaryRoutePath: any[] = [];
+
+ constructor() {
+ // The timeouts are used to demonstrate dynamically preloading routes
+ // Check the network tab to see this in action!
+ setTimeout(() => {
+ this.primaryRoutePath = ['/', 'home'];
+ console.log('Home route added');
+ }, 3000);
+ setTimeout(() => {
+ this.secondaryRoutePath = ['/', { outlets: { side: ['social'] } }];
+ console.log('Social route added');
+ }, 2000);
+ }
+}
diff --git a/projects/standalone-app/src/app/home.component.ts b/projects/standalone-app/src/app/home.component.ts
index 2ec273e..de3d0f2 100644
--- a/projects/standalone-app/src/app/home.component.ts
+++ b/projects/standalone-app/src/app/home.component.ts
@@ -5,18 +5,6 @@ import { QuicklinkDirective } from 'ngx-quicklink';
@Component({
standalone: true,
imports: [RouterLink, QuicklinkDirective],
- template: `
-
-
-
-
-
-
-
-
-
- About
- `,
+ template: ` Home Component `,
})
-export default class HomeComponent {
-}
+export default class HomeComponent {}
diff --git a/projects/standalone-app/src/app/root.component.ts b/projects/standalone-app/src/app/root.component.ts
new file mode 100644
index 0000000..56f5328
--- /dev/null
+++ b/projects/standalone-app/src/app/root.component.ts
@@ -0,0 +1,10 @@
+import { Component } from '@angular/core';
+import { RouterLink } from '@angular/router';
+import { QuicklinkDirective } from 'ngx-quicklink';
+
+@Component({
+ standalone: true,
+ imports: [RouterLink, QuicklinkDirective],
+ template: ` Root Component `,
+})
+export default class RootComponent {}
diff --git a/projects/standalone-app/src/app/social.component.ts b/projects/standalone-app/src/app/social.component.ts
new file mode 100644
index 0000000..1cf5349
--- /dev/null
+++ b/projects/standalone-app/src/app/social.component.ts
@@ -0,0 +1,10 @@
+import { Component } from '@angular/core';
+import { RouterLink } from '@angular/router';
+import { QuicklinkDirective } from 'ngx-quicklink';
+
+@Component({
+ standalone: true,
+ imports: [RouterLink, QuicklinkDirective],
+ template: ` Social Component `,
+})
+export default class SocialComponent {}
diff --git a/projects/standalone-app/src/app/subfolder/subcomponent.ts b/projects/standalone-app/src/app/subfolder/subcomponent.ts
new file mode 100644
index 0000000..9c773f7
--- /dev/null
+++ b/projects/standalone-app/src/app/subfolder/subcomponent.ts
@@ -0,0 +1,8 @@
+import { Component } from '@angular/core';
+
+@Component({
+ standalone: true,
+ imports: [],
+ template: ` SUB COMPONENT `,
+})
+export default class SubComponent {}
diff --git a/projects/standalone-app/src/main.ts b/projects/standalone-app/src/main.ts
index 55ba096..c0437ec 100644
--- a/projects/standalone-app/src/main.ts
+++ b/projects/standalone-app/src/main.ts
@@ -12,12 +12,32 @@ bootstrapApplication(AppComponent, {
{
path: 'about',
loadComponent: () => import('./app/about.component'),
+ children: [
+ {
+ path: 'sub',
+ loadComponent: () => import('./app/subfolder/subcomponent'),
+ },
+ ],
},
{
- path: '',
+ path: 'home',
pathMatch: 'full',
loadComponent: () => import('./app/home.component'),
},
+ {
+ path: 'social',
+ loadComponent: () => import('./app/social.component'),
+ outlet: 'side',
+ },
+ {
+ path: 'root',
+ pathMatch: 'full',
+ loadComponent: () => import('./app/root.component'),
+ },
+ {
+ path: '**',
+ redirectTo: 'root',
+ },
],
withPreloading(QuicklinkStrategy)
),
diff --git a/projects/standalone-app/src/styles.css b/projects/standalone-app/src/styles.css
index 90d4ee0..dc0a9cf 100644
--- a/projects/standalone-app/src/styles.css
+++ b/projects/standalone-app/src/styles.css
@@ -1 +1,5 @@
/* You can add global styles to this file, and also import other style files */
+body {
+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica,
+ Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+}
diff --git a/src/styles.css b/src/styles.css
index 90d4ee0..dc0a9cf 100644
--- a/src/styles.css
+++ b/src/styles.css
@@ -1 +1,5 @@
/* You can add global styles to this file, and also import other style files */
+body {
+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica,
+ Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+}