5

We are using facebook tracking pixel, to track the performance of our facebook ads. To do so, for every user that comes to our service for the first time we need to fire tracking pixel in DOM. We do it by setting $scope.newReg to true in controller and with following code in template.

<div ng-if="newReg == true">
<img height="1" width="1" alt="" style="display:none" src="https://www.facebook.com/tr?ev=xxxxxx&amp;cd[value]=0.00&amp;cd[currency]=EUR&amp;noscript=1" />
</div>

The question is what is really going on if $scope.newReg is set to false. I guess that tracking pixel should'n be fired, but according to documentation it seems like it can be fired. "If condition is falsy then the element is removed from the DOM tree." Which means that tracking pixel could for a very short moment appear in the DOM and then being removed. And that would fire tracking counter even if condition fails.

Ladislav M
  • 2,157
  • 4
  • 36
  • 52
  • I think it depends on where your tracking pixel HTML is. – Raju Mandapati Oct 07 '14 at 16:54
  • If the above markup is inside the default html page that has ng-app, then this will be loaded into DOM before Angular bootstraps and evaluates `ng-if` directive. So YES, this would appear for a very short moment atleast if the style attribute doesn't say `display:none`. – Raju Mandapati Oct 07 '14 at 16:59
  • According to Facebook sample code, it has style attribute that says display:none. Anyway it's not about whether the pixel is actually shown, but about if it's being fired. – Ladislav M Oct 08 '14 at 19:17
  • The markup is inside partial file, so it is under specific controller. As we are using Ionic framework, we have ui-router for joining controllers and views. – Ladislav M Oct 08 '14 at 19:22

2 Answers2

3

Nobody else dealing with this issue?

This answer seems to be working for me: Facebook Custom Audience pixel on SinglePageApplication SPA

But I believe that there are more ways how to handle it.

Community
  • 1
  • 1
Ladislav M
  • 2,157
  • 4
  • 36
  • 52
1

I'd suggest you to not depend on ng-if documentation, that may change next version due to performance needs or just some bugs.

I suggest you to create your own tracking pixel directive that injects the html if conditions are good.

Chen Kinnrot
  • 20,609
  • 17
  • 79
  • 141
  • Sounds like a better solution, but how would you create directive then? I can't see any other way, than just use ng-if inside the template markup of directive. Which way would you injects the html? – Ladislav M Oct 12 '14 at 16:09