# ng-packery

> AngularJS Directive for Packery Layout

Latest version **1.0.4** (published 2015-12-18) · MIT license · 0 weekly downloads

## Install

```sh
npm install ng-packery
pnpm add ng-packery
yarn add ng-packery
bun add ng-packery
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.4 |
| Published | 2015-12-18 |
| First published | 2015-12-09 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Lucas Lim |
| Maintainers | lucaslim |
| Keywords | angular, angularjs, directive, packery, jquery |

## Links

- npm: https://www.npmjs.com/package/ng-packery
- Repository: https://github.com/lucaslim/angular-packery
- Homepage: https://github.com/lucaslim/angular-packery/
- Issues: https://github.com/lucaslim/angular-packery/issues
- npm.io page: https://npm.io/package/ng-packery

## Alternatives

- [gamedig](https://npm.io/package/gamedig.md) — 29.3K weekly downloads
- [join-monster](https://npm.io/package/join-monster.md) — 12.8K weekly downloads
- [masked](https://npm.io/package/masked.md) — 5.5K weekly downloads
- [@comunica/actor-query-process-explain-logical](https://npm.io/package/@comunica/actor-query-process-explain-logical.md) — 4.7K weekly downloads
- [@veracity/vui](https://npm.io/package/@veracity/vui.md) — 4.6K weekly downloads

## Recent versions

- 1.0.4 (latest) — 2015-12-18
- 1.0.3 — 2015-12-18
- 1.0.2 — 2015-12-15
- 1.0.1 — 2015-12-09
- 1.0.0 — 2015-12-09

## README

# angular-packery
[AngularJS](http://angularjs.org/) Directive for Packery Layout by [David DeSandro](http://packery.metafizzy.co/)

## Usage
### Browserify
install from npm
```npm
npm install --save ng-packery 
```
require module
```js
var ngPackery = require('ngPackery')
```
attach module to application
```js
var app = angular.module('app', [ngPackery]);
```

### Manually
include in HTML
```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
```js
var app = angular.module('app', ['ngPackery']);
```

## Example
Any options listed in [Packery](http://packery.metafizzy.co/options.html) website can be used in the 'data-packery-options' attribute
```html
<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](http://packery.metafizzy.co/)

---
_Source: https://npm.io/package/ng-packery · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._