How to Get Browser Name and Version in Angular?

By Hardik Savani | May 2, 2020 | Category : Angular

Hi Dev,

In this short tutorial we will cover an angular get browser name and version. This article goes in detailed on angular get browser name. i would like to show you angular detect browser name. i would like to share with you get browser name in angular. Here, Creating a basic example of get browser version angular.

I will give you very simple example of getting browser name and version in angular. you can easily use this example in angular 6, angular 7, angular 8, angular 9 and angular 10 version for detect browser name and version.

in this example i created two functions one is myBrowser() for check browser name and another is getBrowserVersion() for check browser version.

Let's see simple example and use in your app


import { Component, OnInit } from '@angular/core';


selector: 'my-app',

templateUrl: './app.component.html',

styleUrls: [ './app.component.css' ]


export class AppComponent implements OnInit {

name = 'Angular';

ngOnInit() {




myBrowser() {

if((navigator.userAgent.indexOf("Opera") || navigator.userAgent.indexOf('OPR')) != -1 ) {

return 'Opera';

}else if(navigator.userAgent.indexOf("Chrome") != -1 ){

return 'Chrome';

}else if(navigator.userAgent.indexOf("Safari") != -1){

return 'Safari';

}else if(navigator.userAgent.indexOf("Firefox") != -1 ) {

return 'Firefox';

}else if((navigator.userAgent.indexOf("MSIE") != -1 ) || (!!document.documentMode == true )){

return 'IE';

} else {

return 'unknown';




var userAgent= navigator.userAgent, tem,

matchTest= userAgent.match(/(opera|chrome|safari|firefox|msie|trident(?=\/))\/?\s*(\d+)/i) || [];


tem= /\brv[ :]+(\d+)/g.exec(userAgent) || [];

return 'IE '+(tem[1] || '');


if(matchTest[1]=== 'Chrome'){

tem= userAgent.match(/\b(OPR|Edge)\/(\d+)/);

if(tem!= null) return tem.slice(1).join(' ').replace('OPR', 'Opera');


matchTest= matchTest[2]? [matchTest[1], matchTest[2]]: [navigator.appName, navigator.appVersion, '-?'];

if((tem= userAgent.match(/version\/(\d+)/i))!= null) matchTest.splice(1, 1, tem[1]);

return matchTest.join(' ');





Chrome 81

I hope it can help you...

Hardik Savani
My name is Hardik Savani. I'm a full-stack developer, entrepreneur and owner of Aatman Infotech. I live in India and I love to write tutorials and tips that can help to other artisan. I am a big fan of PHP, Javascript, JQuery, Laravel, Codeigniter, VueJS, AngularJS and Bootstrap from the early stage.
Follow Me: Github Twitter
***Do you want me hire for your Project Work? Then Contact US.

We are Recommending you: