ngx-device-info v3.0.9
Device detector / Device info / Permissions info
Angular library which provides device information / type / name and also it provides much more device independent features & informations.
Get device information and more
Import
Import the module on your app.module.ts
file as follow.
import { NgxDeviceInfoModule} from "ngx-device-info";
Add to imports
imports: [
...
NgxDeviceInfoModule
...
],
Using service
Import the servie to appropriate component / service file as follows.
import { NgxDeviceInfoService } from 'ngx-device-info';
constructor(public device: NgxDeviceInfoService) {}
Permissions
Get the permission status for following api's - as boolean (true/false):
public deviceInfo: any;
constructor(public device: NgxDeviceInfoService) {
this.device.getDeviceInfo().then((data) => {
this.deviceInfo = data;
});
}
Methods
- Permission list:
'geolocation',
'notifications',
'push',
'midi',
'camera',
'microphone',
'speaker',
'device-info',
'background-fetch',
'background-sync',
'bluetooth',
'persistent-storage',
'ambient-light-sensor',
'accelerometer',
'gyroscope',
'magnetometer',
'clipboard',
'display-capture',
'nfc',
Methods | usage | |
---|---|---|
getDeviceName() | returns device specific name | |
isDesktop() | returns true if decice is desktop | |
isMobile() | returns true if decice is mobile | |
isTablet() | returns true if decice is tablet | |
getDeviceType() | returns device type mobile - tablet - desktop | |
getDeviceInfo() | returns object of info | |
deviceName | returns device name | |
deviceType | returns device type | |
userAgent | returns userAgent | |
language | returns device language | |
isOnline | returns whether internet is on - off | |
cookieEnabled | checks is cookieEnabled | |
vendor | returns vendor info | |
clientHeight | Inner height of the HTML document body, including padding but not the horizontal scrollbar height, border, or margin | |
height | Device screen height (i.e. all physically visible stuff) | |
availHeight | Device screen height minus the operating system taskbar (if present) | |
innerHeight | The current document's viewport height, minus taskbars, etc. | |
outerHeight | Height the current window visibly takes up on screen | |
clientWidth | Full width of the HTML page as coded, minus the vertical scroll bar | |
width | Device screen width (i.e. all physically visible stuff) | |
availWidth | Device screen width, minus the operating system taskbar (if present) | |
innerWidth | The browser viewport width (including vertical scroll bar, includes padding but not border or margin) | |
outerWidth | The outer window width (including vertical scroll bar, | |
href | returns location - href | |
protocol | returns location - protocol | |
host | returns location - host | |
hostname | returns location - hostname | |
pathname | returns location - pathname | |
search | returns location - search | |
hash | returns location - hash | |
origin | returns location - origin | |
timeZoneOffSet | returns date- timeZoneOffSet | |
utcString | returns date- utcString | |
time | returns date- time | |
date | returns date- date | |
day | returns date- day | |
month | returns date- month | |
hour | returns date- hour | |
year | returns date- year | |
seconds | returns date- seconds | |
milliseconds | returns date- milliseconds | |
utcdate | returns date- utcdate | |
utcday | returns date- utcday | |
utcmonth | returns date- utcmonth | |
utcyear | returns date- utcyear |
Code integration
To use this package as a service npm i ngx-device-info
install this on the root angular project .
Note: Don't forget to run this commend
npm i ngx-device-info
on root folder or else it will throw error.
Then import the module as follow on imports array
NgxDeviceInfoModule
3 months ago
6 months ago
7 months ago
10 months ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago