/angular-responsify.js

Responsive utility for angularjs.
  1. JavaScript 100.0%
JavaScript
Switch branches/tags
Nothing to show
Find file
Clone or download

Clone with HTTPS

Use Git or checkout with SVN using the web URL.

Download ZIP

Launching GitHub Desktop...

If nothing happens, download GitHub Desktop and try again.

Launching GitHub Desktop...

If nothing happens, download GitHub Desktop and try again.

Launching Xcode...

If nothing happens, download Xcode and try again.

Launching Visual Studio...

If nothing happens, download the GitHub extension for Visual Studio and try again.

Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
dist
src
.envrc
.eslintrc
.gitignore
README.md
karma.conf.js
package.json
yarn.lock

README.md

angular-responsify.js

Responsive utility for angularjs build on top of RxJS and MatchMedia. Add ability to call $scope.$digest() on viewport changed.

Installation

Simply install from github for now (will be published to npm registry soon)

$ yarn add rx-angular angular-media-queries ball6847/angular-responsify.js#master

Import to your angularjs application and inject it into your component.

import angular from 'angular'
import 'rx-angular'
import 'angular-media-queries'
import 'angular-responsify'

angular.module('yourApp', ['angular-responsify'])
  .component('yourComponent', {
    template: 'current screen: {{ screenSize.get() }}',
    controller: ['$scope', 'responsify', ($scope, responsify) => {
      responsify($scope)

      // screenSize now available in your $scope and ready to use in template
    }]
  })

TODO

  • Publish NPM package
  • Remove dependencies

Author

Porawit Poboonma