Как обнаружить браузер с помощью angularjs?

Угловое библиотека использует документ.documentMode для идентификации IE . Он содержит основной номер версии для IE или NaN/undefined, если пользовательский агент не является IE.

/**
* documentMode is an IE-only property
* http://msdn.microsoft.com/en-us/library/ie/cc196988(v=vs.85).aspx
*/
var msie = document.documentMode;

https://github.com/angular/angular.js/blob/v1.5.0/src/Angular.js#L167-L171

пример $document (угловая обертка для окна.документ)

// var msie = document.documentMode;
var msie = $document[0].documentMode;
// if is IE (documentMode contains IE version)
if (msie) {
  // IE logic here

  if (msie === 9) {
    // IE 9 logic here

  }
}

вы должны использовать условные комментарии

<!--[if IE 9]>
<script type="text/javascript">
    window.isIE9 = true;
</script>
<![endif]-->

затем вы можете проверить $window.isIE9 в ваших контроллерах.

не уверен, почему вы указываете, что он должен быть в угловой. Это легко сделать с помощью JavaScript. Посмотрите на navigator

вы можете легко использовать модуль "ng-device-detector".

https://github.com/srfrnk/ng-device-detector

var app = angular.module('myapp', ["ng.deviceDetector"]);
app.controller('DeviceCtrl', ["$scope","deviceDetector",function($scope,deviceDetector) {
      console.log("browser: ", deviceDetector.browser);
      console.log("browser version: ", deviceDetector.browser_version);
      console.log("device: ", deviceDetector.device);
}]);

Итак, вы можете объявить больше утилит для angular, создав файл с содержимым (я следую за библиотекой RGraph)

(function(window, angular, undefined) {'use strict';
    var agl = angular || {};
    var ua  = navigator.userAgent;

    agl.ISFF     = ua.indexOf('Firefox') != -1;
    agl.ISOPERA  = ua.indexOf('Opera') != -1;
    agl.ISCHROME = ua.indexOf('Chrome') != -1;
    agl.ISSAFARI = ua.indexOf('Safari') != -1 && !agl.ISCHROME;
    agl.ISWEBKIT = ua.indexOf('WebKit') != -1;

    agl.ISIE   = ua.indexOf('Trident') > 0 || navigator.userAgent.indexOf('MSIE') > 0;
    agl.ISIE6  = ua.indexOf('MSIE 6') > 0;
    agl.ISIE7  = ua.indexOf('MSIE 7') > 0;
    agl.ISIE8  = ua.indexOf('MSIE 8') > 0;
    agl.ISIE9  = ua.indexOf('MSIE 9') > 0;
    agl.ISIE10 = ua.indexOf('MSIE 10') > 0;
    agl.ISOLD  = agl.ISIE6 || agl.ISIE7 || agl.ISIE8; // MUST be here

    agl.ISIE11UP = ua.indexOf('MSIE') == -1 && ua.indexOf('Trident') > 0;
    agl.ISIE10UP = agl.ISIE10 || agl.ISIE11UP;
    agl.ISIE9UP  = agl.ISIE9 || agl.ISIE10UP;

})(window, window.angular);

после этого, в вашей функции использования можно использовать его как

function SampleController($scope){
    $scope.click = function () {
        if(angular.ISCHROME) {
        alert("is chrome");
    }
}

Я изменил вышеописанную технику, которая была близка к тому, что я хотел для углового и превратил ее в сервис :-). Я включил ie9, потому что у меня были некоторые проблемы в моем приложении angularjs, но может быть что-то, что я делаю, поэтому не стесняйтесь вынимать его.

angular.module('myModule').service('browserDetectionService', function() {

 return {
isCompatible: function () {

  var browserInfo = navigator.userAgent;
  var browserFlags =  {};

  browserFlags.ISFF = browserInfo.indexOf('Firefox') != -1;
  browserFlags.ISOPERA = browserInfo.indexOf('Opera') != -1;
  browserFlags.ISCHROME = browserInfo.indexOf('Chrome') != -1;
  browserFlags.ISSAFARI = browserInfo.indexOf('Safari') != -1 && !browserFlags.ISCHROME;
  browserFlags.ISWEBKIT = browserInfo.indexOf('WebKit') != -1;

  browserFlags.ISIE = browserInfo.indexOf('Trident') > 0 || navigator.userAgent.indexOf('MSIE') > 0;
  browserFlags.ISIE6 = browserInfo.indexOf('MSIE 6') > 0;
  browserFlags.ISIE7 = browserInfo.indexOf('MSIE 7') > 0;
  browserFlags.ISIE8 = browserInfo.indexOf('MSIE 8') > 0;
  browserFlags.ISIE9 = browserInfo.indexOf('MSIE 9') > 0;
  browserFlags.ISIE10 = browserInfo.indexOf('MSIE 10') > 0;
  browserFlags.ISOLD = browserFlags.ISIE6 || browserFlags.ISIE7 || browserFlags.ISIE8 || browserFlags.ISIE9; // MUST be here

  browserFlags.ISIE11UP = browserInfo.indexOf('MSIE') == -1 && browserInfo.indexOf('Trident') > 0;
  browserFlags.ISIE10UP = browserFlags.ISIE10 || browserFlags.ISIE11UP;
  browserFlags.ISIE9UP = browserFlags.ISIE9 || browserFlags.ISIE10UP;

  return !browserFlags.ISOLD;
  }
};

});

существует библиотека ng-устройство-детектор, который делает обнаружение объектов, таких как браузер, ОС легко.

вот учебник, который объясняет, как использовать эту библиотеку. обнаружение ОС, браузера и устройства в AngularJS

ngDeviceDetector

вам нужно добавить re-дерево.js и ng-устройство-детектор.js скрипты в ваш html

Inject "ng.deviceDetector" как зависимость в вашем модуле.

после этого впрысните " deviceDetector" обслуживание обеспеченное библиотекой в ваши регулятор или фабрику где всегда вы хотите данные.

"deviceDetector" содержит все данные, касающиеся браузера, ОС и устройства.

почему бы не использовать document.documentMode доступно только в IE:

var doc = $window.document;
if (!!doc.documentMode)
{
  if (doc.documentMode === 10)
  {
    doc.documentElement.className += ' isIE isIE10';
  }
  else if (doc.documentMode === 11)
  {
    doc.documentElement.className += ' isIE isIE11';
  }
  // etc.
}

браузер нюхать, как правило, следует избегать, функция обнаружения намного лучше, но иногда вы должны сделать это. Например, в моем случае Windows 8 планшеты перекрывает окно браузера с клавиатуры; смешно я знаю, но иногда вам приходится иметь дело с реальностью.

Так что вы бы измерить ' навигатор.userAgent ' как и с обычным JavaScript (пожалуйста, не впадайте в привычку рассматривать Angular как что-то отличное от JavaScript, используйте простой JavaScript, если это возможно приведет к меньшему будущему рефакторингу).

однако для тестирования вы хотите использовать вводимые объекты, а не глобальные. Поскольку ' $location 'не содержит userAgent, простой трюк заключается в использовании' $window.местоположение.userAgent'. Теперь вы можете писать тесты, которые вводят заглушку $window с любым userAgent, который вы не хотите имитировать.

Я не использовал его в течение многих лет, но Modernizr является хорошим источником кода для проверки функций. https://github.com/Modernizr/Modernizr/issues/878#issuecomment-41448059

обнаружение ie9+

var userAgent, ieReg, ie;
  userAgent = $window.navigator.userAgent;
  ieReg = /msie|Trident.*rv[ :]*11\./gi;
  ie = ieReg.test(userAgent);

if (ie) {
   // js for ie9,10 and 11
}