Question

95

Angular 2: Check whether user's browser is compatible

rated 0 times [ 96] [ 1] / answers: 1 / hits: 35079 / 8 Years ago, tue, april 26, 2016, 12:00:00

I'm writing an Angular 2 app but am conscious that some users may not be using a browser that can support Angular 2.

I have a check for whether Javascript is enabled, I am more interested in whether the user's browser doesn't support certain JS/HTML5/other features required by Angular 2.

What would be the best way to assess whether the user's browser supports Angular 2, and display a message if not?

I'm aware of e.g. Modernizer, but not sure where to begin as Modernizer's focus seems to be on assembling compatibility checks piecemeal rather than providing a solution that checks for compatibility of whole frameworks.

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

robinh

Add To Favorites

Follow

Total Points: 371

Total Questions: 105

Total Answers: 89

Location: Cyprus

Member since Mon, Oct 24, 2022

2 Years ago

robinh questions

1 How to disable the Material UI Link API component

Thu, May 6, 21, 00:00, 3 Years ago

1 React functional components vs class components

Thu, Jan 7, 21, 00:00, 3 Years ago

1 JS Error: Element is not attached to a Document

Fri, Nov 6, 20, 00:00, 4 Years ago

1 Add custom add-button in material-table

Sun, Aug 9, 20, 00:00, 4 Years ago

1 Swiper.js pagination custom bullet won't click to move to next slide

Tue, Jul 28, 20, 00:00, 4 Years ago

View All

answered 8 Years ago shamya · Accepted Answer

Angular 2, and display a message if not?

The version of browsers that angular supports officially might not be the version of browsers your app works (it may be more or it may be less).

You have to do individual browser checks yourself. e.g. Detect IE : http://codepen.io/gapcode/pen/vEJNZN

/**

 * detect IE

 * returns version of IE or false, if browser is not Internet Explorer

 */

function detectIE() {

  var ua = window.navigator.userAgent;



  // Test values; Uncomment to check result …



  // IE 10

  // ua = 'Mozilla/5.0 (compatible; MSIE 10.0; Windows NT 6.2; Trident/6.0)';



  // IE 11

  // ua = 'Mozilla/5.0 (Windows NT 6.3; Trident/7.0; rv:11.0) like Gecko';



  // IE 12 / Spartan

  // ua = 'Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/39.0.2171.71 Safari/537.36 Edge/12.0';



  // Edge (IE 12+)

  // ua = 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/46.0.2486.0 Safari/537.36 Edge/13.10586';



  var msie = ua.indexOf('MSIE ');

  if (msie > 0) {

    // IE 10 or older => return version number

    return parseInt(ua.substring(msie + 5, ua.indexOf('.', msie)), 10);

  }



  var trident = ua.indexOf('Trident/');

  if (trident > 0) {

    // IE 11 => return version number

    var rv = ua.indexOf('rv:');

    return parseInt(ua.substring(rv + 3, ua.indexOf('.', rv)), 10);

  }



  var edge = ua.indexOf('Edge/');

  if (edge > 0) {

    // Edge (IE 12+) => return version number

    return parseInt(ua.substring(edge + 5, ua.indexOf('.', edge)), 10);

  }



  // other browser

  return false;

}