如何在ionicframework中每3次点击调用admob interstitial?

时间:2017-02-20 05:10:12

标签: angularjs ionic-framework admob hybrid-mobile-app cordova-admob

我希望每3次点击就可以调用插页式广告。 我意识到了很多类型的问题,但只针对原生的android。 非常感谢你的关注。

我的HTML IONIC

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
    <title></title>

    <script src="lib/ionic/js/ionic.bundle.js"></script>


    <script src="lib/ng-cordova.min.js"></script>
    <script src="cordova.js"></script>


    <link href="lib/ionic/css/ionic.css" type="text/css" rel="stylesheet">
    <link href="css/animate.css" type="text/css" rel="stylesheet">
    <link href="css/style.css" type="text/css" rel="stylesheet">


<script src="js/app.js"></script>
    <script src="js/controllers.js"></script>
    <script src="js/routes.js"></script>
    <script src="js/directives.js"></script>
    <script src="js/services.js"></script>

  </head>
  <body ng-app="passLite" animation="slide-left-right-ios7">


  <div>
  <div>
    <ion-nav-bar class="bar-assertive">


        <ion-nav-back-button class="button-clear"><i class="ion-android-arrow-back"></i> </ion-nav-back-button>
    </ion-nav-bar>
    <ion-nav-view></ion-nav-view>
  </div>

</div>
  </body>
</html>

我的模板

<ion-view title="new" id="page2">
  <ion-content padding="true" class="has-header">


            <!--Config Button-->
      <button class=" animated bounceIn" ng-click="btnClicked('click')">
        <i class="icon ion-android-refresh"></i>
      </button>           

        </ion-content>
</ion-view>

我的控制器,假设错误

angular.module('app.controllers', [])
.controller('new', ['$rootScope', '$scope', '$timeout', '$stateParams',
function ($rootScope, $scope, $timeout, $stateParams) {

$scope.counter = 1;
$scope.btnClicked = function(btn){
         if (btn == 'click'){


            //on every 3th clicks show the Interstitial ad one second after the result appears
            if ($scope.counter++ == 3){
                setTimeout(function(){
                    if (AdMob){
                        AdMob.showInterstitial();   
                    }

                    $scope.counter = 1;
                }, 1000);
            }
        }

    };


}])

1 个答案:

答案 0 :(得分:2)

您可以在此处查看示例:https://github.com/appfeel/admob-google-cordova/wiki/showInterstitialAd和此处:https://github.com/appfeel/admob-google-cordova/wiki/Angular.js,-Ionic-apps

基本上:

angular.module('myApp', ['admobModule'])

  .config(['admobSvcProvider', function (admobSvcProvider) {
    var adPublisherIds = {
      ios : {
        banner : "ca-app-pub-XXXXXXXXXXXXXXXX/BBBBBBBBBB",
        interstitial : "ca-app-pub-XXXXXXXXXXXXXXXX/IIIIIIIIII"
      },
      android : {
        banner : "ca-app-pub-XXXXXXXXXXXXXXXX/BBBBBBBBBB",
        interstitial : "ca-app-pub-XXXXXXXXXXXXXXXX/IIIIIIIIII"
      }
    };
    var admobid = (/(android)/i.test(navigator.userAgent)) ? adPublisherIds.android : adPublisherIds.ios;

    admobSvcProvider.setOptions({
      publisherId:          admobid.banner,
      interstitialAdId:     admobid.interstitial,
      autoShowInterstitial: false
    });
  }])

  .run(['$rootScope', 'admobSvc', function ($rootScope, admobSvc) {
    $rootScope.isInterstitialAvailable = false;
    admobSvc.requestInterstitialAd();

    // Handle events:
    $rootScope.$on(admobSvc.events.onAdLoaded, function onAdLoaded(evt, e) {
      if (e.adType === admob.AD_TYPE.INTERSTITIAL) {
        $rootScope.isInterstitialAvailable = true;
      }
    });

    $rootScope.$on(admobSvc.events.onAdClosed, function onAdClosed(evt, e) {
      if (e.adType === admob.AD_TYPE.INTERSTITIAL) {
        $rootScope.isInterstitialAvailable = false;

        // Request next interstitial: there may be some delay
        // between the moment it is requested and the moment it is available
        admobSvc.requestInterstitialAd();
      }
    });
  }]);

然后在你的控制器中:

angular.module('app.controllers', [])
  .controller('new', ['$rootScope', '$scope', '$timeout', '$stateParams', 'admobSvc', function ($rootScope, $scope, $timeout, $stateParams, admobSvc) {

    $scope.counter = 0;
    $scope.btnClicked = function(btn) {
      if (btn == 'click') {
        $scope.counter += 1;
        if ($scope.counter >= 3) {
          $timeout(function() {
            if ($rootScope.isInterstitialAvailable) {
              admobSvc.showInterstitial();   
            }
            $scope.counter = 0;
          }, 1);
        }
      }
    };
  }]);