From 8fbec3fa91167369a8fea41cb61acabce379d7e4 Mon Sep 17 00:00:00 2001 From: TheDreWen Date: Tue, 3 Feb 2026 11:30:01 +0100 Subject: [PATCH] feat: add routing and basic pages for Home and About --- src/app/about/about.ts | 8 + src/app/app.html | 343 +---------------------------------------- src/app/app.routes.ts | 13 +- src/app/app.spec.ts | 23 --- src/app/app.ts | 5 +- src/app/home/home.ts | 8 + 6 files changed, 31 insertions(+), 369 deletions(-) create mode 100644 src/app/about/about.ts delete mode 100644 src/app/app.spec.ts create mode 100644 src/app/home/home.ts diff --git a/src/app/about/about.ts b/src/app/about/about.ts new file mode 100644 index 0000000..311b690 --- /dev/null +++ b/src/app/about/about.ts @@ -0,0 +1,8 @@ +import { Component } from "@angular/core"; + +@Component({ + selector: 'app-about', + template: '

About Page

', +}) +export class AboutPage { +} \ No newline at end of file diff --git a/src/app/app.html b/src/app/app.html index e0118a1..90c6b64 100644 --- a/src/app/app.html +++ b/src/app/app.html @@ -1,342 +1 @@ - - - - - - - - - - - -
-
-
- -

Hello, {{ title() }}

-

Congratulations! Your app is running. 🎉

-
- -
-
- @for (item of [ - { title: 'Explore the Docs', link: 'https://angular.dev' }, - { title: 'Learn with Tutorials', link: 'https://angular.dev/tutorials' }, - { title: 'Prompt and best practices for AI', link: 'https://angular.dev/ai/develop-with-ai'}, - { title: 'CLI Docs', link: 'https://angular.dev/tools/cli' }, - { title: 'Angular Language Service', link: 'https://angular.dev/tools/language-service' }, - { title: 'Angular DevTools', link: 'https://angular.dev/tools/devtools' }, - ]; track item.title) { - - {{ item.title }} - - - - - } -
- -
-
-
- - - - - - - - - - - + \ No newline at end of file diff --git a/src/app/app.routes.ts b/src/app/app.routes.ts index dc39edb..7a7c0e9 100644 --- a/src/app/app.routes.ts +++ b/src/app/app.routes.ts @@ -1,3 +1,14 @@ import { Routes } from '@angular/router'; +import { AboutPage } from './about/about'; +import { HomePage } from './home/home'; -export const routes: Routes = []; +export const routes: Routes = [ + { + path: '', + component: HomePage + }, + { + path: 'about', + component: AboutPage + } +]; \ No newline at end of file diff --git a/src/app/app.spec.ts b/src/app/app.spec.ts deleted file mode 100644 index 89b2590..0000000 --- a/src/app/app.spec.ts +++ /dev/null @@ -1,23 +0,0 @@ -import { TestBed } from '@angular/core/testing'; -import { App } from './app'; - -describe('App', () => { - beforeEach(async () => { - await TestBed.configureTestingModule({ - imports: [App], - }).compileComponents(); - }); - - it('should create the app', () => { - const fixture = TestBed.createComponent(App); - const app = fixture.componentInstance; - expect(app).toBeTruthy(); - }); - - it('should render title', async () => { - const fixture = TestBed.createComponent(App); - await fixture.whenStable(); - const compiled = fixture.nativeElement as HTMLElement; - expect(compiled.querySelector('h1')?.textContent).toContain('Hello, myfirstangularapp'); - }); -}); diff --git a/src/app/app.ts b/src/app/app.ts index 156b6f5..b4320d1 100644 --- a/src/app/app.ts +++ b/src/app/app.ts @@ -1,4 +1,4 @@ -import { Component, signal } from '@angular/core'; +import { Component } from '@angular/core'; import { RouterOutlet } from '@angular/router'; @Component({ @@ -8,5 +8,4 @@ import { RouterOutlet } from '@angular/router'; styleUrl: './app.css' }) export class App { - protected readonly title = signal('myfirstangularapp'); -} +} \ No newline at end of file diff --git a/src/app/home/home.ts b/src/app/home/home.ts new file mode 100644 index 0000000..5813e64 --- /dev/null +++ b/src/app/home/home.ts @@ -0,0 +1,8 @@ +import { Component } from "@angular/core"; + +@Component({ + selector: 'app-home', + template: '

Home Page

', +}) +export class HomePage { +}