Angular.js＆Adsense

我想把广告放在我的angular.js应用程序上，而且我已经做了一些阅读，发现它不可能复制和粘贴正常的AdSense代码。Angular.js＆Adsense

我听说你都应该“与transclusion一个指令把它包起来，”我能找到的这个唯一的例子是另一个岗位＃1： AngularJs and AddThis social plugin

有人能帮助提供有关如何引导去谷歌Adsense这样做？

2013-07-02 David Litwak

您好大卫，我一直在学习角最近太运行。我曾经与这个人John Lindquist一起工作（他也在Papervision上做过一些工作，这是我最初听到的），无论如何，他有一个网站http://www.egghead.io专门用于角色教程。看看有关指令的东西，他有几个短片介绍它。除此之外，我只会使用文档作为最新的参考。根据我的理解，基本问题是角将添加/删除DOM元素，如果有需要处理这些DOM元素的JS，则需要将它放入指令中以便运行。 – shaunhusain

你应该做一个包装指令，这样在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异步代码。

来源

2013-07-07 12:27:39

这似乎没有工作，我的广告空白（但奇怪的仍然与加载的iframe）。有任何想法吗？我在ng-repeat中使用它们，每个第四个元素都有一个广告。你可以看到它在sparkmyinterest.com如果这有助于 – Rob

任何更新？这里有同样的问题。 – ericbae

这个解决方案似乎可行，但是当ng-view被改变时，如果在ng-repeat中打印多个ADS：第一次我查看视图：OK（或者有时会丢失一个或多个ADS），但是改变查看并返回一些（或全部）ADS丢失 – ricricucit

你需要创建一个指示

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>

将adSense js调用放置在主页的头部部分之前angularjs

<head> 
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> 
....

等瞧，这是完全为我工作

来源

2014-03-29 18:28:44

因为我有多个视图和路由，它只显示前3次，然后在重新加载站点之前无法运行。 – Kode

hi @kode，我在我的网络应用程序中有许多视图，但在我的情况下，它的工作完美无缺，请您提供更多的细节。 –

谢谢@ zied.hosni。我有一个帖子在这里：http://stackoverflow.com/questions/29709973/angular-adsense-ads-not-loading-on-route-change-up-to-3-ads-for-the-entire-app它似乎唯一的区别是我的指令使用替换：true – Kode

在AngularJS控制器，添加一个init()功能，添加一行

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

然后调用此init()功能在您查看HTML文件。

也看到
https://github.com/featen/ags/blob/master/webapp/js/controllers/dict.js

来源

2014-05-05 22:07:25 featen

我不知道是否做以下的事情是根据AdSense牛逼& C.

删除所有的谷歌相关的变量更改URL之前有效

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

来源

2014-10-06 10:10:29

在javascript文件中为谷歌adsense定义一个自定义指令

window.app.directive('googleAd', [ 
    '$timeout', function($timeout) { 
    return { 
     restrict: 'A', 
     link: function(scope, element, attr) { 
     return $timeout(function() { 
      var adsbygoogle, html, rand; 
      rand = Math.random(); 
      html = "<ins class='adsbygoogle' style='display:block' data-ad-client='ca-pub-7656700967113967' data-ad-slot='1894787830' data-ad-format='auto'></ins>"; 
      $(element).append(html); 
      return (adsbygoogle = window.adsbygoogle || []).push({}); 
     }); 
     } 
    }; 
    }

上述指令的AdSense信息由Google在您选择广告时提供。在页面显示AD-使用下面的标签

<div google-ad=""></div>

在指数。HTML使用

<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>

的视频教程获得此起来，在这里提供AngularJS + Adsense

来源

2017-01-10 15:16:51 Rameez

Angular.js＆Adsense

回答

相关问题