angolare 2: Controllare se il browser dell'utente è compatibile

Question

sto scrivendo un angolare 2 app, ma sono consapevole che alcuni utenti non possono utilizzare un browser in grado di supportare angolare 2.

Ho un assegno per se Javascript è abilitato, sono più interessato a sapere se il browser dell'utente non supporta determinati JS/HTML5/altre funzionalità richieste da Angular 2.

Quale sarebbe il modo migliore per valutare se il browser dell'utente supporta Angular 2 e visualizzare un messaggio se non?

Sono a conoscenza ad es. Modernizer, ma non sono sicuro da che parte cominciare poiché l'attenzione di Modernizer sembra essere sull'assemblaggio dei controlli di compatibilità in modo frammentario piuttosto che sulla fornitura di una soluzione che controlli la compatibilità di intere strutture.

Answer 1

Angolare 2 e visualizzare un messaggio se non?

La versione di browser che supporta angolarmente ufficialmente potrebbe non essere la versione dei browser utilizzata dall'app (potrebbe essere più o potrebbe essere inferiore).

È necessario eseguire personalmente i singoli controlli del browser. per esempio. Rileva 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; 
} 

Answer 2

Non tutti i browser supportano ancora pienamente ES6 standard (ES2015).

https://kangax.github.io/compat-table/es6/

Se si desidera utilizzare caratteristiche del linguaggio ES6 per il vostro angolare 2 app allora si dovrebbe includere lo spessore ES6 per portare il browser up-to-spec:

https://cdnjs.cloudflare.com/ajax/libs/es6-shim/0.35.0/es6-shim.min.js

Stando detto, IE sembra essere l'eccezione. Ci sono polyfills aggiuntivi che è necessario includere per supportare IE:

https://npmcdn.com/angular2/es6/dev/src/testing/shims_for_IE.js

Se si vuole indirizzare ES5 (più vecchio standard), è necessario assicurarsi che si scrive la vostra applicazione angolare utilizzando il linguaggio ES5 presenta solo. In generale, non v'è più il supporto del browser per le funzionalità ES5, ma non è perfetto:

http://kangax.github.io/compat-table/es5/

Naturalmente, c'è uno spessore anche per questo:

https://cdnjs.cloudflare.com/ajax/libs/es5-shim/4.5.8/es5-shim.min.js