Angular.js&的Adsense

时间:2013-07-02 03:35:27

标签: angularjs angularjs-directive adsense transclusion

我正在尝试在我的angular.js应用上投放广告,并且我已经完成了一些阅读并发现无法复制和粘贴普通的adsense代码。

我听说你应该“将它包装在带有翻译的指令中”,而我能找到的唯一例子是另一个Stackoverflow帖子: AngularJs and AddThis social plugin

有人可以帮助提供有关如何使用Google Adsense进行此操作的指导吗?

4 个答案:

答案 0 :(得分:18)

你需要创建一个指令

yourApp.directive('ads', function() {
    return {
        restrict: 'A',
        templateUrl: 'partiels/adsTpl',
        controller: function(){
            (adsbygoogle = window.adsbygoogle || []).push({});
        }
    };
});

在我的案例中创建一个包含广告代码的模板" partiels / adsTpl.html"

<ins class="adsbygoogle"
 style="display:inline-block;width:300px;height:250px"
 data-ad-client="ca-pub-00000000"
 data-ad-slot="000000"></ins>

将指令添加到您的页面

 <div data-ads></div>

在angularjs

之前将adSense js调用放在主页的head部分
<head>
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
....

et瞧,这对我来说非常适合

答案 1 :(得分:15)

您应该像这样对adSense脚本执行包装指令...

<div data-my-ad-sense>
  <!-- Google AdSense -->
  <script async src="http://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
  <ins class="adsbygoogle"
       style="display:inline-block;width:728px;height:90px"
       data-ad-client="ca-pub-0000000000"
       data-ad-slot="0000000000"></ins>
  <script>
  (adsbygoogle = window.adsbygoogle || []).push({});
  </script>
</div>

并将此指令添加到您的指令......

directive('myAdSense', function() {
  return {
    restrict: 'A',
    transclude: true,
    replace: true,
    template: '<div ng-transclude></div>',
    link: function ($scope, element, attrs) {}
  }
})

这是adSense异步代码。

答案 2 :(得分:2)

根据adsense T&amp; C,我不确定做以下事情是否有效。

在更改网址之前删除所有与谷歌相关的变量

Object.keys(window).filter(function(k) { return /google/.test(k) }).forEach(
        function(key) {
            delete(window[key]);
        }
    );

答案 3 :(得分:0)

在AngularJS控制器中,添加init()函数,添加一行

(adsbygoogle = window.adsbygoogle || []).push({});

然后在视图html文件中调用此init()函数。

另见
https://github.com/featen/ags/blob/master/webapp/js/controllers/dict.js