Question

我有几个使用AngularJS应用的网站。每个网站都有不同的GTM跟踪。我将跟踪代码存储在我们的数据库中。例如：

<!-- Google Tag Manager -->
    <noscript>
        <iframe src="//www.googletagmanager.com/ns.html?id=GTM-XXXXX"
                height="0" width="0" style="display:none;visibility:hidden"></iframe>
    </noscript>
    <script>
(function (w, d, s, l, i) {
w[l] = w[l] || []; w[l].push({
'gtm.start':
        new Date().getTime(), event: 'gtm.js'
}); var f = d.getElementsByTagName(s)[0],
j = d.createElement(s), dl = l != 'dataLayer' ? '&l=' + l : ''; j.async = true; j.src =
'//www.googletagmanager.com/gtm.js?id=' + i + dl; f.parentNode.insertBefore(j, f);
})(window, document, 'script', 'dataLayer', 'GTM-XXXXX');</script>
    <!-- End Google Tag Manager -->

在我的角度应用中，我已经检索了代码，但是如何将其插入到我的HTML中呢？我试过了：

<div id="tracking">
    {{tracking}}
</div>

但是这会在屏幕上显示代码。

Answer 1

这可能会对你有所帮助

而不是

<div id="tracking">
    {{tracking}}
</div>

你写的那个

<div ng-bind-html="tracking">
</div>

你必须在脚本中

<script src="https://code.angularjs.org/1.4.9/angular.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular-sanitize.js"></script>

并注入模块

var app = angular.module('myApp', ['ngSanitize']);

Answer 2

似乎解决方案是使用$ sce服务。示例：http://erikaugust.com/thoughts/ng-bind-html/

从数据库中检索GTM代码并在angularJS app

2 个答案: