CODEWITHSUNDEEP
cordovaionic-frameworkcordova-plugins
Zabs
Zabs

Reputation: 14142

Cannot get device information on Ionic/Cordova App to appear

I have an Ionic app and I am trying to display the device information as follows within my views.

Code (coffeeScript):

angular.module('hgApp', ['ionic'])
 .run(($ionicPlatform, $rootScope) ->
 aboutPageFunction($rootScope)
 $ionicPlatform.ready ->
deviceInformation = ionic.Platform.device()
console.log(deviceInformation)
  if window.cordova and window.cordova.plugins.Keyboard
    cordova.plugins.Keyboard.hideKeyboardAccessoryBar true
    cordova.plugins.Keyboard.disableScroll true
  if window.StatusBar
    StatusBar.styleDefault()
  return
 return
).config [
'$stateProvider'
'$urlRouterProvider'
($stateProvider, $urlRouterProvider) ->
$stateProvider.state('app',
  url: '/app'
  abstract: true
  templateUrl: './sections/menu/menu.tpl.html'
  controller: 'roomList'
).state('app.myHouse',
  url: '/myHouse'
  views:
    'menuContent':
      templateUrl: './sections/myHouse/myHouse.tpl.html'
)
# if none of the above states are matched, use this as the fallback
$urlRouterProvider.otherwise 'app/myHouse'
return
]

aboutPageFunction = ($rootScope) ->
 device = ionic.Platform.device()
 $rootScope.currentPlatform = ionic.Platform.platform()
 $rootScope.currentPlatformVersion = ionic.Platform.version()
 $rootScope.manufacturer = device.manufacturer
 return

Template view

<ion-view view-title="About">
 <ion-content>
         <span>Manufacturer:>{{manufacturer}}</p></span>
        <span>Current platform:>{{currentPlatform}}</p></span>
        <span>Current platform version:>{{currentPlatformVersion}}</p></span>
 </ion-content>
</ion-view view-title="About">

I am using Chrome to setup an 'Google Nexus 5' device using the tools in the browser.

When I refresh the page it doesn't show manufacturer but it shows the latter two variables as show below:

Manufacturer:
Current platform: android
Current platform version: 6

Any ideas why the device object doesn't display the manufacturer info?

-- note -- When I console.log($ionicPlatform) within the ready() I get a valid object but do not see any device stuff.

Upvotes: 0

Views: 1741

Answers (2)

matt.condit
matt.condit

Reputation: 121

Just to write it more concisely for those looking for this answer:

1.) make sure to have cordova-plugin-device installed, you can check this in your config file or by running cordova plugin ls

2.) The user (and I) were trying to reference the device object as ionic.Platform.device(), which is how it's show at this link: http://ionicframework.com/docs/v1/api/utility/ionic.Platform/. However, if you installed the above plugin, the device info you're looking for is actually found in window.device, or simply device if there are no local device variables.

Hope this helps.

Upvotes: 1

manzapanza
manzapanza

Reputation: 6205

You can use the cordova-plugin-device to get the device's hardware and software details.

document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {
    console.log(device);
}

properties device object:

device.cordova
device.model
device.platform
device.uuid
device.version
device.manufacturer
device.isVirtual
device.serial

UPDATE

The $ionicPlatform.ready execute a callback when the device is ready, so you don't really need to add a devicereadyevent listener:

angular.module('hgApp', ['ionic'])
 .run(($ionicPlatform, $rootScope) ->
 aboutPageFunction($rootScope)
 $ionicPlatform.ready ->

  if window.device
    console.log(device)

  if window.cordova and window.cordova.plugins.Keyboard
    cordova.plugins.Keyboard.hideKeyboardAccessoryBar true
    cordova.plugins.Keyboard.disableScroll true
  if window.StatusBar
    StatusBar.styleDefault()
  return
 return
)

Upvotes: 1

Related Questions