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

回答

相關問題