exercises

Unnamed repository; edit this file 'description' to name the repository.
Log | Files | Refs | README

header.component.ts (1069B)


      1 import { Component, ElementRef, viewChild, AfterViewInit, inject } from '@angular/core';
      2 import { UserProfileComponent } from './user-profile.component';
      3 import { SearchComponent } from './search.component';
      4 import { ClickOutsideDirective } from '../components/click-outside.directive';
      5 import { CartService } from '../services/cart.service';
      6 
      7 @Component({
      8   selector: 'header.app-header',
      9   templateUrl: './header.component.html',
     10   styleUrls: ['./header.component.scss'],
     11   standalone: true,
     12   imports: [UserProfileComponent, SearchComponent, ClickOutsideDirective],
     13 })
     14 export class HeaderComponent implements AfterViewInit {
     15   readonly cartService = inject(CartService);
     16   
     17   cartBtn = viewChild<ElementRef<HTMLButtonElement>>('cartBtn');
     18 
     19   ngAfterViewInit() {
     20     const cartButton = this.cartBtn()?.nativeElement;
     21     if (cartButton) {
     22       let cachedRect: DOMRect | null = null;
     23       window.cartBtnPosition = () => {
     24         if (!cachedRect) {
     25           cachedRect = cartButton.getBoundingClientRect();
     26         }
     27         return cachedRect;
     28       };
     29     }
     30   }
     31 }