Angular Material Course

Author: jhades

router.config.ts

@@ -0,0 +1,10 @@
+
+
+
+import {Routes} from "@angular/router";
+
+export const routerConfig: Routes = [
+    {
+        path: '',
+    }
+];

src/app/app.module.ts

@@ -7,15 +7,19 @@ import {MatMenuModule} from '@angular/material/menu';
 import {MatIconModule} from '@angular/material/icon'
 
 import { TopMenuComponent } from './top-menu/top-menu.component';
+import {RouterModule} from "@angular/router";
+import { HomeComponent } from './home/home.component';
 
 @NgModule({
     declarations: [
         AppComponent,
-        TopMenuComponent
+        TopMenuComponent,
+        HomeComponent
     ],
     imports: [
         BrowserModule,
         BrowserAnimationsModule,
+        RouterModule.forRoot(),
         MatMenuModule,
         MatIconModule
     ],

src/app/home/home.component.css

@@ -0,0 +1,3 @@
+<p>
+  home works!
+</p>

src/app/home/home.component.html

@@ -0,0 +1,16 @@
+import { Component, OnInit, ViewEncapsulation } from '@angular/core';
+
+@Component({
+  selector: 'home',
+  templateUrl: './home.component.html',
+  styleUrls: ['./home.component.css'],
+  encapsulation: ViewEncapsulation.None
+})
+export class HomeComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit() {
+  }
+
+}

src/app/home/home.component.ts

@@ -1,3 +1,2 @@
 /* You can add global styles to this file, and also import other style files */
 
-@import "~@angular/material/prebuilt-themes/deeppurple-amber.css";