ng-device-detector

Angular module to detect OS / Browser / Device

Uses user-agent to set CSS classes or directly usable via JS. See website: http://srfrnk.github.io/ng-device-detector

Install

NPM

$ npm install ng-device-detector --save

Bower

$ bower install ng-device-detector --save

Browser (Add scripts in HTML)

<script type="text/javascript" src=".../re-tree.js"></script>
<script type="text/javascript" src=".../ua-device-detector.js"></script>
<script type="text/javascript" src=".../ng-device-detector.js"></script>

Adding 'ng.deviceDetector' to your app module dependencies

angular.module('app', ['ng.deviceDetector']);

Injecting DeviceDetector service in controller

angular.module('app').controller('Home', function($scope, deviceDetector){
  // Awesome stuff
});

To add classes, add directive like: <div device-detector>

Setup

You can set custom detectors at the provider object. The

angular.module('app', ["ng.deviceDetector"])
    .config(['deviceDetectorProvider', function(deviceDetectorProvider) {
      deviceDetectorProvider.addCustom("Custom_UA_Entry", {
        and:["\\bCustom_UA_Entry\\b", {
            not:"\\bChrome\\b"
        }]
      });
    }])
    
    .controller('Home', function($scope, deviceDetector) {
      // (true / false)
      $scope.customUAEntry = deviceDetector.custom["Custom_UA_Entry"];
    });

Custom detectors will also be added as CSS classes with 'is-' prefix and encoded into css class name casing.

deviceDetector service

Holds the following properties:

• raw : object : contains the raw values... for internal use mostly.
• os : string : name of current OS
• browser : string : name of current browser
• device : string : name of current device

Support

At first I added just major browser, OS, device support. With help from mariendries, javierprovecho and crisandretta more support was added. The current list of supported browser, OS, device can be easily viewed in here.

Pull-requests with new stuff will be highly appreciated :)

Example

See plunker

License

MIT License