Search code examples
angularjsionic-frameworkionic-cloud

Ionic - Error: [$injector:unpr] Unknown provider: ionic.cloudProvider <- ionic.cloud


The Issue: I am using Ionic 1 trying to setup push notifications with Ionic Cloud. I get the following error:

**Error: [$injector:unpr] Unknown provider: ionic.cloudProvider <- ionic.cloud <- welcomeCtrl**
ionic.bundle.js:26794 Error: [$injector:unpr] Unknown provider: ionic.cloudProvider <- ionic.cloud <- welcomeCtrl
http://errors.angularjs.org/1.5.3/$injector/unpr?p0=ionic.cloudProvider%20%3C-%20ionic.cloud%20%3C-%20welcomeCtrl
    at ionic.bundle.js:13438
    at ionic.bundle.js:17788
    at Object.getService [as get] (ionic.bundle.js:17941)
    at ionic.bundle.js:17793
    at getService (ionic.bundle.js:17941)
    at injectionArgs (ionic.bundle.js:17965)
    at Object.instantiate (ionic.bundle.js:18007)
    at $controller (ionic.bundle.js:23412)
    at Object.self.appendViewElement (ionic.bundle.js:59900)
    at Object.render (ionic.bundle.js:57893)(anonymous function) @ ionic.bundle.js:26794

My app.js:

    angular.module('app', [
                'ionic',
                'ionic.cloud',
...

I am injecting ionic.cloud.

.config(function($ionicConfigProvider, $ionicCloudProvider) {
    // Set tabs always to load on top
    $ionicConfigProvider.tabs.position('top');

  $ionicCloudProvider.init({
    "core": {
      "app_id": "(my app id was here)"
    },
    "push": {
      "sender_id": "(FCM sender id was here)",
      "pluginConfig": {
        "ios": {
          "badge": true,
          "sound": true
        },
        "android": {
          "iconColor": "#343434"
        }
      }
    }
  });
});

I have my config setup properly.

Then in my index.html I have:

  <script src="lib/ionic/js/ionic.bundle.js"></script>
  <!-- ionic cloud -->
  <script src="lib/ionic.cloud.min.js"></script>

And finally in my controller I have:

angular.module('app.controllers')
.controller('welcomeCtrl', ['$scope', '$stateParams', 'UserService', '$cordovaDevice', '$cordovaCapture','$cordovaFileTransfer', '$cordovaGeolocation', '$location', '$timeout','$state', '$ionicHistory', 'ionic.cloud',
function ($scope, $stateParams, UserService, $cordovaDevice, $cordovaCapture, $cordovaFileTransfer, $cordovaGeolocation, $location,$timeout,$state, $ionicHistory, $ionicPush) {

You will see I am inject 'ionic.cloud' and $ionicPush

I have verified in chrome device debug that the resources are there. I followed the Ionic cloud docs to the T, but keep receiving this error.

Anyone have any ideas?

Thanks!


Solution

  • Problem here is in your controller you dont have to inject ionic.cloud, it should be

    angular.module('app.controllers')
    .controller('welcomeCtrl', ['$scope', '$stateParams', 'UserService', '$cordovaDevice', '$cordovaCapture','$cordovaFileTransfer', 
    '$cordovaGeolocation', '$location', '$timeout','$state', '$ionicHistory', '$ionicPush',
    function ($scope, $stateParams, UserService, $cordovaDevice, $cordovaCapture, $cordovaFileTransfer, $cordovaGeolocation, 
    $location,$timeout,$state, $ionicHistory, $ionicPush) {
    

    }

    And if your controller is from different module, it should have ionic.cloud injected

    angular.module('app.controllers',['ionic',
                    'ionic.cloud'])