Adobe DTM not recognizing angular variable as data element

Question

I'm defining data elements within the Adobe DTM admin panel, as per the instructions at:

http://microsite.omniture.com/t2/help/en_US/dtm/index.html#Data_Elements

I've had success testing fairly standard JS variables such as document.URL; this populates into a prop and/or eVar correctly.

Our framework is angular; We've created an Angular factory called "analytics" that holds the values that will need to be accessed by our analytics package.

I've also tested the factory via chrome developer tools to make sure that it returns the correct value in the console, and it does return the correct value.

And example line to access these values is as follows:

angular.element('*[ng-app]').injector().get('analytics').sVar.profileId

This returns the correct value in console, e.g.: "1234-5678-9101"

When I attempt to use this path in Adobe DTM, no value is populated in the prop and/or eVar assigned to this value.

I'm wondering if Adobe Analytics is having trouble interpreting this path, or if I am using the incorrect path. My exposure to AngularJS is beginner.

Thank you.

Answer 1

That's not really a path.. that's a set of js expressions that are chained together, so I'm not sure whether or not DTM can actually handle that.

Have you tried doing it as a custom script instead? It should definitely work if you do it that way.

If it still doesn't work, then it sounds like you also have a timing issue. Scroll down to the "Data Element Availability" section on that page.

But even then that might not be enough. e.g. if you are using this in a rule that's set to trigger in the "top" that may come before your data even exists. So you may need to change that too.

edit w/ more information about timing

DTM does not currently offer a way to control when a Data Element is set through the interface (e.g. a dropdown like in event based rules). However, it does offer a way to explicitly set it in general.

In short, you can call this to explicitly have the data element be evaluated

_satellite.getVar('data element name');

Where you put this depends on when/where you need it to be available. So basically you will make a call to that in a context that DTM does allow for timing control.

For example, as I mentioned before, scroll down to the "Data Element Availability" section for details about how to explicitly set a data element as part of a rule condition. And for example a page load rule can be set to pop on DOM ready or Onload (window.load).

It may be that even this won't work for you, e.g. if angular service layer calls are happening after dom ready or window.load (I don't know what your script is actually doing).

If that is the case, an alternative is to put the DTM bottom page code in a callback for when you data is available from angular's service layer calls and (if it's not already) change your adobe analytics call to trigger at "page bottom".

Or, you could let the initial Adobe Analytics page view happen at its own pace and invoke a DTM Direct Call rule and have your vars pop as a 2nd Adobe Analytics call. Basically the way that works is you make a Direct Call rule and for the condition string you'd have something unique like "foobar" and then set your Adobe vars in the rule. Then inside whatever angular callback you have that gets popped when data layer values are available, you'd call

_satellite.track('foobar')

edit #2

So I poked around in the DTM core code, and it looks to me that pageBottomFired also gets set to true on dom ready. So basically wrapping _satellite.pageBottom() in something isn't going to work for you (strikeout above). IMO I don't think it should be this way but I guess it is what it is.

I know for sure the direct call method will work, as I have used that approach before.. but I agree, it's not an ideal solution. One thing you could do to remove the extra ping from that is remove Adobe Analytics from the main tool listing and instead output it as custom js within the direct call rule - which basically means the data element is now pointless, since you can just directly pop s.prop or w/e directly in there along with your Adobe Analytics code. In short, it's a really ugly solution that defeats the point of DTM but unless Adobe were to change things up to only trigger pageBottom() when it is explicitly called, it's either this or live with a double Adobe Analytics request :/

I suppose another alternative might be to throw the actual DTM script include into your angular.js callback, but a) that also destroys the value of DTM having full timing scope, b) I have no clue how DTM would actually react to that. I may play around with it and see if it "works", but no promises.