chore: update example app to use inject function

analogjs · Oct 17, 2022 · 7612613 · 7612613
1 parent df17233
commit 7612613
Show file tree

Hide file tree

Showing 4 changed files with 16 additions and 20 deletions.
diff --git a/apps/analog-app/src/app/routes/cart.ts b/apps/analog-app/src/app/routes/cart.ts
@@ -1,5 +1,5 @@
 import { CurrencyPipe, NgForOf } from '@angular/common';
-import { Component } from '@angular/core';
+import { Component, inject } from '@angular/core';
 import { FormBuilder, ReactiveFormsModule } from '@angular/forms';
 import { RouterLinkWithHref } from '@angular/router';
 
@@ -37,18 +37,16 @@ import { CartService } from '../cart.service';
   `,
 })
 export default class CartComponent {
+  private cartService = inject(CartService);
+  private formBuilder = inject(FormBuilder);
+
   items = this.cartService.getItems();
 
   checkoutForm = this.formBuilder.group({
     name: '',
     address: '',
   });
 
-  constructor(
-    private cartService: CartService,
-    private formBuilder: FormBuilder
-  ) {}
-
   onSubmit(): void {
     // Process checkout data here
     this.items = this.cartService.clearCart();

diff --git a/apps/analog-app/src/app/routes/index.ts b/apps/analog-app/src/app/routes/index.ts
@@ -6,6 +6,10 @@ import { ProductAlertsComponent } from '../product-alerts/product-alerts.compone
 
 import { products } from '../products';
 
+export const routeMeta = defineRouteMeta({
+  title: 'Product List',
+});
+
 @Component({
   selector: 'app-product-list',
   standalone: true,
@@ -56,7 +60,3 @@ export default class ProductListComponent {
     window.alert('You will be notified when the product goes on sale');
   }
 }
-
-export const routeMeta = defineRouteMeta({
-  title: 'Product List',
-});
diff --git a/apps/analog-app/src/app/routes/products.[productId].ts b/apps/analog-app/src/app/routes/products.[productId].ts
@@ -1,6 +1,6 @@
-import { Component, OnInit } from '@angular/core';
-import { ActivatedRoute } from '@angular/router';
+import { Component, inject, OnInit } from '@angular/core';
 import { CurrencyPipe, NgIf } from '@angular/common';
+import { injectActivatedRoute } from '@analogjs/router';
 
 import { Product, products } from '../products';
 import { CartService } from '../cart.service';
@@ -21,12 +21,10 @@ import { CartService } from '../cart.service';
   `,
 })
 export default class ProductDetailsComponent implements OnInit {
-  product: Product | undefined;
+  private route = injectActivatedRoute();
+  private cartService = inject(CartService);
 
-  constructor(
-    private route: ActivatedRoute,
-    private cartService: CartService
-  ) {}
+  product: Product | undefined;
 
   ngOnInit() {
     // First get the product id from the current route.

diff --git a/apps/analog-app/src/app/routes/shipping/index.ts b/apps/analog-app/src/app/routes/shipping/index.ts
@@ -1,5 +1,5 @@
 import { AsyncPipe, CurrencyPipe, NgForOf } from '@angular/common';
-import { Component, OnInit } from '@angular/core';
+import { Component, inject, OnInit } from '@angular/core';
 
 import { Observable } from 'rxjs';
 import { CartService } from '../../cart.service';
@@ -18,9 +18,9 @@ import { CartService } from '../../cart.service';
   `,
 })
 export default class ShippingComponent implements OnInit {
-  shippingCosts!: Observable<{ type: string; price: number }[]>;
+  private cartService = inject(CartService);
 
-  constructor(private cartService: CartService) {}
+  shippingCosts!: Observable<{ type: string; price: number }[]>;
 
   ngOnInit(): void {
     this.shippingCosts = this.cartService.getShippingPrices();