Device detector Angular – Brief tutorial

Kategorien Angular 4, Blog Posts, Typescript
device detector

Hello everyone this is a brief Tutorial on how to detect the device where angular is running on.

This Module is made by KoderLabs

Ngx-device-detector is an Angular5+ library to detect the device it can also detect OS and showing you some browser details.

So let´s start of by installing the Module for your Angular App.

Totally reading time 5 Minutes

1. Install Angular device detector

First install the module via npm Package manger. Direct to your angular root folder and type in npm install ngx-device-detector –save


2. Implement Angular device detector

2.1 Include DeviceDetectorModule in app.module.ts

Open your app.module.ts and Import DeviceDetectorModule


Now the Device Detector is included to our project its time to use it now.

2.2 Include DeviceDetectorModule where you want to use the Module

Open your component .ts file where you want to implement the Module.

In my case its app.component.ts. Import DeviceDetectorModule and also be sure to declare the deviceService in the constructor. Also call the function getDeviceInfo() and store it in an Object.

This object will contain following data:

  • Browser
  • Os
  • Device
  • userAgent
  • os_version


This is what getDeviceInfo() is giving you back :


You can also directly ask if the device you currently running angular is an Mobile device or an tablet or a Desktop.

This module got following fucntions for you  isMobile(), isTablet() and isDesktop();

This function give back a boolean wether the device angular is running on is mobile tablet or a Destop PC.



This is the whole project except app.module.ts

Hope you enjoyed this tutorial if so let me know and leave a comment downstairs.

Hope you have all a good day.

Credit for this Module goes to



1 Gedanke zu „Device detector Angular – Brief tutorial

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.