var browserVersion = int((/msie (\d+)/.exec(lowercase(navigator.userAgent)) || [])[1]);
我需要特别检测IE9!
检测浏览器的make和version通常是一种难闻的气味。这通常意味着,如果你需要JavaScript来检测浏览器的特定版本,你有一个更大的问题的代码。
有一些特殊功能不能正常工作,例如WebSockets不支持在IE 8或9.这应该通过检查WebSocket支持,如果没有本机支持应用polyfill解决。
这应该使用Modernizr这样的库。
话虽如此,你可以轻松地创建返回浏览器的服务。有些情况下,某个功能存在于浏览器中,但实现已过时或已损坏。 Modernizr不适合这些情况。
app.service('browser',['$window',function($window) { return function() { var userAgent = $window.navigator.userAgent; var browsers = {chrome: /chrome/i,safari: /safari/i,firefox: /firefox/i,ie: /internet explorer/i}; for(var key in browsers) { if (browsers[key].test(userAgent)) { return key; } }; return 'unknown'; } }]);
固定拼写错误
注意:这只是一个例子,如何创建一个服务的角度,将嗅探userAgent字符串。这只是一个代码示例,不期望在生产中工作,并报告所有浏览器在所有情况下。
更新
最好使用像https://github.com/ded/bowser或https://github.com/darcyclarke/Detect.js这样的第三方库。这些库分别在一个名为bowser或detect的窗口上放置一个对象。
然后你可以将它暴露给Angular IoC Container,像这样:
angular.module('yourModule').value('bowser',bowser);
要么
detectFactory.$inject = ['$window']; function detectFactory($window) { return detect.parse($window.navigator.userAgent); } angular.module('yourModule').factory('detect',detectFactory);
然后你会注入其中一个通常的方式,并使用lib提供的API。如果您选择使用另一个使用构造函数方法的库,您将创建一个实例化它的工厂:
function someLibFactory() { return new SomeLib(); } angular.module('yourModule').factory('someLib',someLibFactory);
然后你会注入到你的控制器和服务的正常方式。
如果要注入的库不完全符合您的要求,您可能需要使用适配器模式,您可以使用所需的确切方法创建类/构造函数。
在这个例子中,我们只需要测试IE 9,我们将使用上面的bowser lib。
BroswerAdapter.$inject = ['bowser']; // bring in lib function BrowserAdapter(bowser) { this.bowser = bowser; } BrowserAdapter.prototype.isIe9 = function() { return this.bowser.msie && this.browser.version == 9; } angular.module('yourModule').service('browserAdapter',BrowserAdapter);
现在在控制器或服务,你可以注入browserAdapter,只是做if(browserAdapter.isIe9){//做某事}
如果以后你想使用检测而不是bowser,代码中的更改将被隔离到BrowserAdapter。
更新
在现实中,这些价值观从不改变。如果您在IE 9中加载页面,它将永远不会成为Chrome 44.因此,不是将BrowserAdapter注册为服务,而是将结果放在一个值或常量中。
angular.module('app').value('isIe9',broswerAdapter.isIe9);