❤
npm
Sign UpSign In

ng-packery

1.0.4 • Public • Published

angular-packery

AngularJS Directive for Packery Layout by David DeSandro

Usage

Browserify

install from npm

npm install --save ng-packery 

require module

var ngPackery = require('ngPackery')

attach module to application

var app = angular.module('app', [ngPackery]);

Manually

include in HTML

<!-- Dependencies -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/packery/1.4.3/packery.pkgd.min.js"></script>
<!-- End Dependencies -->
 
<script src="angular-packery.js"></script>

attach to application

var app = angular.module('app', ['ngPackery']);

Example

Any options listed in Packery website can be used in the 'data-packery-options' attribute

<packery data-packery-options='{ "columnWidth": 200 }'>
    <packery-item data-ng-repeat="item in list">
        {{ item }}
    </packery-item>
</packery>

Credits

This directive is created based on Packery Layout by David DeSandro

Readme

Keywords

Package Sidebar

Install

npm i ng-packery

Repository

github.com/lucaslim/angular-packery

Homepage

github.com/lucaslim/angular-packery/

Weekly Downloads

15

Version

1.0.4

License

MIT

Last publish

Collaborators

  • lucaslim
Try on RunKit
Report malware