1.0.3 • Published 8 years ago
ng-media-query v1.0.3
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 });