Javascript 谷歌标签管理器与AngularJS？

如何将GTM与Angular一起使用

当我使用以下代码加载新的分部时，我试图触发（虚拟）pageview事件：

dataLayer.push({
    'event' : 'pageview',
    'pageview' : $location.path(),
    'virtualUrl' : $location.path()
 });

---

但是我没有看到事件触发（我正在使用Google Analytics Chrome debug扩展来查看触发的事件）。

实现这一点的可能方法是使用

$window

服务。
看看这个答案试试看，如果它有效的话：

---

希望它能工作。

我觉得Chrome扩展不可靠。 只需在控制台中运行全局变量

dataLayer

，即可打印事件数组。其中一个对象应该是您的pageview事件

以下是我们如何使用它的示例：

注意：我们并不是简单地使用

$location.path（）

，而是使用域后url中的所有内容。其中包括

.search（）

和

.hash（）

模块/analysis.js 服务/analysis.js 在GTM中 您需要

{{virtualur}}

和

{{event}}

宏来侦听同名的数据层变量

您需要一个Google Analytics事件跟踪标记，该标记带有触发规则，当

{{Event}

等于'virtualPageView'时触发。确保删除默认的“所有页面”规则，使其在每次页面加载时运行。相反，您希望它在

dataLayer.push（）

事件发生时运行，这可能会在每次页面刷新时发生多次

标签应配置为：

曲目类型==“页面视图”

更多设置>基本配置>虚拟页面路径=='{{virtualur}}'

---

与公认的答案类似，我们为我们的单页应用程序在控制器的Javascript中使用

pagename

变量创建了一个更简单、更明确的解决方案

// Note, this may not be how your app works, YMMV
var pagename = $location.path().substr(1,$location.path().length);

并将它们按如下方式推送到数据层：

window.dataLayer.push({'event':pagename+'-page'})

然后在GTM中，我们在GTM中添加了触发器，如下所示：

Trigger: Custom Event
Event Name: home-page

。。。关于页面、常见问题页面等

对于更复杂的angular应用程序，有一些可用的扩展可用于将Google Analytics和Google Tag Manager与angular一起使用

---

请参阅（它还通过其插件架构支持除Google analytics之外的web分析解决方案）和相关的。

我强烈建议您使用该库。我在多个网站上使用过它。它让你跑得很快

它包括对虚拟页面视图和即时事件的支持。它不支持GA电子商务，但支持扩展性

另外-我已经与GTM和Piwik一起使用。

无需添加代码

---

配置“历史更改”触发器，这是由角度路线更改触发的，将其作为触发器添加到“页面视图”标记中。

是的，我已经阅读了该页面，但它使用传统GA，而我需要使用新的GTM系统。很抱歉，我没有任何GTM经验。希望你得到一个解决方案。哇，谢谢我的GTM终于工作了！我甚至可以实时观看现场活动。非常感谢。这已经折磨了我好几天了。顺便说一句，为什么你要在域名后使用url中的所有内容，而不仅仅是路径？这是我们分析人员的要求。网站上的一些旧页面使用查询字符串而不是路径。“向后兼容性”…我想从bower使用它：）如果它适用于您@ChristianTHC，则应将其标记为答案

window.dataLayer.push({'event':pagename+'-page'})

Trigger: Custom Event
Event Name: home-page