/utils

component.tsx

import { Component, OnInit } from '@angular/core';
import { trackFacebookPixelEvent, trackGoogleAdsConversion } from '@/utils';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})

export class AppComponent implements OnInit {

  constructor(private analyticsConfig: { setFacebookPixel, setGoogleCode } ) {}

  ngOnInit() {
  ngOnInit() {
    this.analyticsConfig.setFacebookPixel("inputPixel");
  ngOnInit() {
    this.analyticsConfig.setGoogleCode('inputGoogleCode');
  }

  trackPurchase() {
    trackFacebookPixelEvent(this.analyticsConfig, 'Purchase', { value: 30.00, currency: 'USD' });
    trackGoogleAdsConversion(this.analyticsConfig, { value: 30.00, currency: 'USD' });
  }
}

index.ts

declare var fbq: Function;
declare var gtag: Function;

export function trackFacebookPixelEvent(configService: any, event: string, data: any = {}) {
  const pixelId = configService.getFacebookPixelId();

  if (typeof fbq === 'function' && pixelId) {
    fbq('init', pixelId);
    fbq('track', event, data);
  } else {
    console.error('Facebook Pixel não está definido ou ID não configurado.');
  }
}

export function trackGoogleAdsConversion(configService: any, data: any = {}) {
  const conversionId = configService.getGoogleAdsConversionId();
  if (typeof gtag === 'function' && conversionId) {
    gtag('config', conversionId);
    gtag('event', 'conversion', {
      'send_to': conversionId,
      ...data
    });
  } else {
    console.error('Google Ads gtag não está definido ou ID não configurado.');
  }
}