Skip to content

Commit 61bc5e3

Browse files
committed
Update README.md
1 parent ce967fe commit 61bc5e3

File tree

1 file changed

+92
-4
lines changed

1 file changed

+92
-4
lines changed

README.md

Lines changed: 92 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,93 @@
11
#Angular-Query
2-
==============
3-
4-
5-
Server-side Filtering, Paging and Sorting
2+
-==============
3+
+AngularQuery is a Model Factory that allows high level methods for server-side filtering, paging and sorting.
4+
+##Getting Started
5+
+- Clone the repo `git clone [email protected]:ducondez/angular-query.git` or just [download](https://github.com/ducondez/angular-query/archive/master.zip) to your angular resources folder
6+
+- Inject the `ngQuery` module into your app
7+
8+
+>
9+
+``` javascript
10+
+var app = angular.module('ngQuery', ['ngQuery']);
11+
+```
12+
13+
-Server-side Filtering, Paging and Sorting
14+
+Take note that our master branch is our active, unstable development branch and that if you're looking to download a stable copy of the repo, check the [tagged downloads](https://github.com/maker/ratchet/tags).
15+
+
16+
+
17+
+##Usage
18+
+###Creating a QueryModel
19+
+The QueryModel accepts a [REST URL, ngResource or VModel(coming soon)] and returns an instance of the QueryModel. The instance has a property called `rows` which is an array containing the results of the query.
20+
+- URL link
21+
+
22+
+>
23+
+``` javascript
24+
+var Cars = new QueryModel('http://mylink.com/cars');
25+
+```
26+
+
27+
+- $resource
28+
+
29+
+>
30+
+``` javascript
31+
+var carsResource = $resource('http://mylink.com/cars');
32+
+var Cars = new QueryModel(carsResource);
33+
+```
34+
+
35+
+- VModel (future: ngResource wrapper superset features)
36+
+
37+
+###Filtering / Querying
38+
+
39+
+>
40+
+``` javascript
41+
+// In the Controller
42+
+var Cars = new QueryModel(carsResource);
43+
+cars.find();
44+
+```
45+
+
46+
+>
47+
+``` html
48+
+<!-- Search box -->
49+
+<input type="text" ng-model="carQuery">
50+
+<button ng-click="cars.find(carQuery)">Find</button>
51+
+<!-- Cars List -->
52+
+<ul>
53+
+ <li ng-repeat="car in cars.rows">car.name</li>
54+
+</ul>
55+
+```
56+
+
57+
+###Pagination
58+
+
59+
+>
60+
+``` html
61+
+<!-- Next -->
62+
+<button ng-click="cars.next()">Next</button>
63+
+<!-- Will create 5 page buttons before and after the current page when applicable -->
64+
+<button ng-repeat="page in cars.pageNumbers(5)" ng-click="cars.movePage(page)"></button>
65+
+<!-- Previous Page -->
66+
+<button ng-click="cars.prev()">Next</button>
67+
+```
68+
+
69+
+###Sorting
70+
+
71+
+>
72+
+``` html
73+
+<table>
74+
+ <thead>
75+
+ <th ng-click="cars.sort('make')">Make</th>
76+
+ <th ng-click="cars.sort('model')">Model</th>
77+
+ <th ng-click="cars.sort('year')">Year</th>
78+
+ </thead>
79+
+</table>
80+
+```
81+
+
82+
+
83+
+
84+
+
85+
+##Roadmap
86+
+- Features/Ideas
87+
+ - Resultset Model instatntiation (for $resource or VModel)
88+
+ - Flexible client-side caching
89+
+- Bower repo
90+
+- Tests
91+
+
92+
+##Reporting bugs & contributing
93+
+Please file a GitHub issue to report a bug.

0 commit comments

Comments
 (0)