exercises

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

user-profile.component.ts (675B)


      1 import { Component, HostBinding, HostListener, signal, input } from '@angular/core';
      2 
      3 @Component({
      4   selector: 'button.profile',
      5   templateUrl: './user-profile.component.html',
      6   styleUrls: ['./user-profile.component.scss'],
      7   standalone: true,
      8 })
      9 export class UserProfileComponent {
     10   userName = 'John Doe';
     11   userEmail = 'john.doe@example.com';
     12   @HostBinding('class.open') isActive = false;
     13 
     14   @HostListener('click', ['$event'])
     15   onProfileClick(event: MouseEvent): void {
     16     if (!this.isActive) {
     17       this.isActive = true;
     18     }
     19   }
     20 
     21   onClickOutside(clickedOutside: boolean): void {
     22     if (this.isActive && clickedOutside) {
     23       this.isActive = false;
     24     }
     25   }
     26 }