ng-media-query v1.0.1

Running media queries in Angularjs

Installation

(1) Bower

bower install ng-media-query

(2) NPM

npm install ng-media-query

(3) Manual

Download ng-media-query.js
or       ng-media-query.min.js

Dependencies

angular.js

Inject as dependency

angular.module('yourApp', ['ngMediaQuery']);

Define query parameters

angular.module('yourApp').value('media', {
    'xs': [-1, 767],
    'sm': [768, 991],
    'md': [992, 1199],
    'lg': [1200, -1]
});

Set 'device key':[minwidth, maxwidth]

Use -1 for no limit.

The key value for media can be changed as per the requirement.

The response will be the provided key (eg. xs).

Usage:

use below methods in your controller, refer example

Get current media

var getMedia = NgMediaQuery.getMedia();        
getMedia.then(function(data){
    $scope.media = data;
}, function(status){
    //  this returns the current media value, initial setting can be set here
   });

Get media on change

$scope.$on('MediaChange', function(event, media){
    $scope.media = media;
    //this is the onchage media, whenever browser is resized or orientation is changed this function is called, set media change functionalities here
});

Feel free for your suggestions and comments.

Please let us know if you need any extra functionalities to be added, we will keep providing examples.