Menu
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?
822
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
111
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.
38
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
