Search code examples
javascriptangularjsionic-frameworkcordova-plugins

"device is not defined" on my ionic app


I know this is asking many times but i cannot find a solution. I have a ionic app and i want to get the device UUID. Here are my codes: Here is my index.html;

<script src="lib/ionic/js/ionic.bundle.js"></script>
<script src="lib/ngCordova/dist/ng-cordova.min.js"></script>
<script src="bower_components/jquery/dist/jquery.min.js"></script>
<script src="bower_components/angular-route/angular-route.min.js"></script>
<script src="bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
<script src="bower_components/angular-animate/angular-animate.min.js"></script>
<script src="bower_components/angular-touch/angular-touch.min.js"></script>
<script src="lib/angular-mocks/angular-mocks.js"></script>
<script src="bower_components/moment/min/moment.min.js"></script>
<script src="bower_components/angular-moment/angular-moment.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/gsap/1.10.3/TweenMax.min.js"></script>
<script src="lib/bootstrap-sweetalert/dist/sweetalert.min.js"></script>

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

My controller;

.controller('AppCtrl', function($scope, $rootScope, $state, $ionicPlatform, $cordovaDevice) {

$scope.uuid = "";
$ionicPlatform.ready(function() {
  if (ionic.Platform.isAndroid()) {
    $scope.uuid = $cordovaDevice.getUUID();
  } else {
    console.log('It is not an android');
  };

});

})

When i run the code console is give me

Uncaught ReferenceError: device is not defined

I import ngCordova to app.js module too. I did everything right but still i cannot handle it. Can anyone tell me what am i doing wrong?


Solution

  • The problem was based on the .js files which listed in index.html. I don't know why but when I import <script src="cordova.js"></script> to index.html it is ok. But when call cordova.js from another file for example <script src="js/cordova.js"></script>, it does not work. So, I changed my index.html like;

    <script src="lib/ionic/js/ionic.bundle.js"></script>
    <script src="lib/ngCordova/dist/ng-cordova.min.js"></script>
    <script src="cordova.js"></script>
    <script src="bower_components/jquery/dist/jquery.min.js"></script>
    <script src="bower_components/angular-route/angular-route.min.js"></script>
    <script src="bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
    <script src="bower_components/angular-animate/angular-animate.min.js"></script>
    <script src="bower_components/angular-touch/angular-touch.min.js"></script>
    <script src="lib/angular-mocks/angular-mocks.js"></script>
    <script src="bower_components/moment/min/moment.min.js"></script>
    <script src="bower_components/angular-moment/angular-moment.min.js"></script>
    <script src="http://cdnjs.cloudflare.com/ajax/libs/gsap/1.10.3/TweenMax.min.js"></script>
    <script src="lib/bootstrap-sweetalert/dist/sweetalert.min.js"></script>
    
    <script src="js/app.js"></script>
    <script src="js/controllers.js"></script>
    <script src="js/directives.js"></script>
    

    And it is ok.