Angular.js & Adsense

I'm trying to put ads on my angular.js app, and I've done some reading and discovered it isn't possible to just copy and paste the normal adsense code.

I've heard you are supposed to "wrap it in a directive with a transclusion," and the only example I can find of this is another Stackoverflow post: AngularJs and AddThis social plugin

Can someone help give guidance about how to go about doing this with Google Adsense?

标签： angularjs angularjs-directive adsense transclusion

5条回答

forever°为你锁心

2楼-- · 2019-01-31 02:43

I am not sure whether doing the following thing is valid as per the adsense T&C.

delete all the google related variables before you change the url

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

0人赞添加讨论(0) 举报

Rolldiameter

3楼-- · 2019-01-31 02:46

you need to create a directive

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

create a template with your ads code in my case "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>

add the directive to your page

 <div data-ads></div>

place the adSense js call in the head section of your main page before angularjs

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

et voila , this is work perfectly for me

0人赞添加讨论(0) 举报

劳资没心，怎么记你

4楼-- · 2019-01-31 02:47

In the AngularJS controller, add an init() function, add a line

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

Then call this init() function in your view html file.

0人赞添加讨论(0) 举报

劳资没心，怎么记你

5楼-- · 2019-01-31 02:58

You should do a wrapper directive to the adSense script like this...

<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>

And add this directive to your directives...

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

This is the adSense async code.

0人赞添加讨论(0) 举报

做个烂人

6楼-- · 2019-01-31 03:03

In the javascript file define a custom directive for google 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({});
        });
      }
    };
  }

The adsense information for the above directive is provided by Google when you select the ad. In the page to display ad- use the following tag

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

In Index.html use the

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

A video tutorial for getting this up and running is provided here AngularJS + Adsense

0人赞添加讨论(0) 举报

Angular.js & Adsense

采纳回答

编辑标签

举报内容

检举类型

检举原因

检举说明(必填)

打开微信“扫一扫”，打开网页后点击屏幕右上角分享按钮

付费偷看金额在0.1-10元之间