agregar basic component, number y uncommon.

05-pipesApp/src/app/app-routing.module.ts

@@ -1,7 +1,12 @@
 import { NgModule } from '@angular/core';
 import { RouterModule, Routes } from '@angular/router';
 
-const routes: Routes = [];
+const routes: Routes = [
+  {
+    path: '',
+    loadChildren: () => import('./products/products.module').then(m => m.ProductsModule),
+  }
+];
 
 @NgModule({
   imports: [RouterModule.forRoot(routes)],

05-pipesApp/src/app/prime-ng/prime-ng.module.ts

@@ -1,14 +1,18 @@
 import { NgModule } from '@angular/core';
 
 import { ButtonModule } from 'primeng/button';
-import { MenuModule } from 'primeng/menu';
+import { CardModule } from 'primeng/card';
+import { FieldsetModule } from 'primeng/fieldset';
 import { MenubarModule } from 'primeng/menubar';
+import { PanelModule } from 'primeng/panel';
 
 @NgModule({
   exports: [
     ButtonModule,
-    MenuModule,
-    MenubarModule
+    CardModule,
+    FieldsetModule,
+    MenubarModule,
+    PanelModule
   ],
 })
 export class PrimeNgModule {}

05-pipesApp/src/app/products/pages/basics-page/basics-page.component.html

@@ -0,0 +1,24 @@
+<p-panel [showHeader]="false">
+    <h1>Pipe Básicos</h1>
+    <p>
+        Pipes incluídos en Angular - Usualmente en el Common Module 
+    </p>
+</p-panel>
+
+<div class="p-grid">
+    <div class="p-col-4">
+        <p-card header="uppercase">
+            {{ nameLower | uppercase }}
+        </p-card>
+    </div>
+    <div class="p-col-4">
+        <p-card header="lowercase">
+            {{ nameUpper | lowercase }}
+        </p-card>
+    </div>
+    <div class="p-col-4">
+        <p-card header="titlecase">
+            {{ fullName | titlecase }}
+        </p-card>
+    </div>
+</div>

05-pipesApp/src/app/products/pages/basics-page/basics-page.component.ts

@@ -0,0 +1,13 @@
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'app-basics-page',
+  templateUrl: './basics-page.component.html',
+  styleUrl: './basics-page.component.css'
+})
+export class BasicsPageComponent {
+
+  public nameLower: string = 'diego';
+  public nameUpper: string = 'DIEGO';
+  public fullName: string = 'DiEgO';
+}

05-pipesApp/src/app/products/pages/numbers-page/numbers-page.component.html

@@ -0,0 +1 @@
+<p>numbers-page works!</p>

05-pipesApp/src/app/products/pages/numbers-page/numbers-page.component.ts

@@ -0,0 +1,10 @@
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'app-numbers-page',
+  templateUrl: './numbers-page.component.html',
+  styleUrl: './numbers-page.component.css'
+})
+export class NumbersPageComponent {
+
+}

05-pipesApp/src/app/products/pages/uncommon-page/uncommon-page.component.html

@@ -0,0 +1 @@
+<p>uncommon-page works!</p>

05-pipesApp/src/app/products/pages/uncommon-page/uncommon-page.component.ts

@@ -0,0 +1,10 @@
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'app-uncommon-page',
+  templateUrl: './uncommon-page.component.html',
+  styleUrl: './uncommon-page.component.css'
+})
+export class UncommonPageComponent {
+
+}

05-pipesApp/src/app/products/products-routing.module.ts

@@ -0,0 +1,30 @@
+import { NgModule } from '@angular/core';
+import { RouterModule, Routes } from '@angular/router';
+import { BasicsPageComponent } from './pages/basics-page/basics-page.component';
+import { NumbersPageComponent } from './pages/numbers-page/numbers-page.component';
+import { UncommonPageComponent } from './pages/uncommon-page/uncommon-page.component';
+
+const routes: Routes = [
+  {
+    path: '',
+    component: BasicsPageComponent
+  },
+  {
+    path: 'numbers',
+    component: NumbersPageComponent
+  },
+  {
+    path: 'uncommon',
+    component: UncommonPageComponent
+  },
+  {
+    path: '**',
+    redirectTo: ''
+  }
+];
+
+@NgModule({
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule]
+})
+export class ProductsRoutingModule { }

05-pipesApp/src/app/products/products.module.ts

@@ -0,0 +1,23 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+
+import { ProductsRoutingModule } from './products-routing.module';
+import { BasicsPageComponent } from './pages/basics-page/basics-page.component';
+import { NumbersPageComponent } from './pages/numbers-page/numbers-page.component';
+import { UncommonPageComponent } from './pages/uncommon-page/uncommon-page.component';
+import { PrimeNgModule } from '../prime-ng/prime-ng.module';
+
+
+@NgModule({
+  declarations: [
+    BasicsPageComponent,
+    NumbersPageComponent,
+    UncommonPageComponent
+  ],
+  imports: [
+    CommonModule,
+    ProductsRoutingModule,
+    PrimeNgModule
+  ]
+})
+export class ProductsModule { }

05-pipesApp/src/app/shared/components/menu/menu.component.ts

@@ -18,15 +18,18 @@ export class MenuComponent implements OnInit {
         items: [
           {
             label: 'Texto y Fechas',
-            icon: 'pi pi-align-left'
+            icon: 'pi pi-align-left',
+            routerLink: 'basics'
           },
           {
             label: 'Números',
-            icon: 'pi pi-dollar'
+            icon: 'pi pi-dollar',
+            routerLink: 'numbers'
           },
           {
-            label: 'No coomunes',
-            icon: 'pi pi-globe'
+            label: 'No comunes',
+            icon: 'pi pi-globe',
+            routerLink: 'uncommon'
           },
         ]
       },