如何在AngularJS中安装使用AdMob插件？Ionic非.ts开发场景问题

别担心，纯AngularJS环境下完全能搞定AdMob插件集成，根本不用碰.ts文件，下面是一步步的实操指南：

第一步：安装AdMob Cordova插件 #

先确认你的Ionic Creator项目已经关联了Cordova（导出的项目默认是配置好的），打开终端进入项目根目录，运行以下命令安装插件：

cordova plugin add cordova-plugin-admob-free --save

如果偏好Google官方插件，也可以用这个：

cordova plugin add cordova-plugin-google-mobile-ads --save

前者配置更简单，更适配AngularJS环境，优先推荐。

第二步：在AngularJS代码中初始化AdMob #

直接在www文件夹下的AngularJS文件（比如app.js或单独的控制器文件）里写纯JS代码就行。注意一定要等Cordova的deviceready事件触发后再初始化插件——这是Cordova插件的通用要求：

angular.module('yourAppName', ['ionic'])
.run(function($rootScope) {
  // 等待Cordova环境就绪
  document.addEventListener("deviceready", function() {
    if (window.AdMob) {
      // 替换成你自己的广告单元ID（测试阶段可用下方测试ID）
      var admobid = {
        banner: 'ca-app-pub-3940256099942544/6300978111', // 横幅测试ID
        interstitial: 'ca-app-pub-3940256099942544/1033173712' // 插屏测试ID
      };

      // 创建并显示底部居中的横幅广告
      window.AdMob.createBanner({
        adId: admobid.banner,
        position: window.AdMob.AD_POSITION.BOTTOM_CENTER,
        autoShow: true
      });

      // 可选：监听广告状态事件
      window.AdMob.onAdLoaded = function() {
        console.log('广告加载成功～');
      };
      window.AdMob.onAdFailedToLoad = function(error) {
        console.log('广告加载失败：', error);
      };
    } else {
      console.log('AdMob插件未加载，请检查插件安装是否正确');
    }
  }, false);
});

第三步：添加插屏广告（可选） #

如果需要在页面跳转、按钮点击时展示插屏广告，可以在对应的控制器里加这段代码：

angular.module('yourAppName')
.controller('HomeCtrl', function($scope) {
  $scope.showInterstitial = function() {
    if (window.AdMob) {
      window.AdMob.prepareInterstitial({
        adId: admobid.interstitial,
        autoShow: true
      });
    }
  };

  // 示例：页面进入时自动展示插屏广告
  $scope.$on('$ionicView.enter', function() {
    $scope.showInterstitial();
  });
});

关键注意事项 #

• 正式上线前一定要把测试ID替换成你在AdMob后台创建的真实广告单元ID，避免违反平台政策。
• 确保项目已经添加了目标平台（安卓/ iOS），可以用cordova platform add android或cordova platform add ios添加。
• 如果插件安装后不生效，试试移除重装：cordova plugin remove cordova-plugin-admob-free && cordova plugin add cordova-plugin-admob-free --save

这样操作下来，你就能在纯AngularJS的Ionic项目里正常使用AdMob广告了，完全不用碰TypeScript文件~

内容的提问来源于stack exchange，提问作者Nuno Rolo