angular-query-builder
Query builder as JSON from angular directive
Install
$ npm install -SE angular-query-builder
Add it as an angular dependency:
angular.module('app', [ 'ngQueryBuilder', ]);Usage
Simply define an options object:
$scope.options = { fields: [ { name: 'Firstname', value: 'firstname' }, { name: 'Birthdate', value: 'birthdate', attrs: { type: 'date' } }, { name: 'City', value: 'city', attrs: { type: 'text', 'required': true } }, { name: 'Country', value: 'country' }, ], // optional operators operators: [ { name: 'AND', value: '$and' }, { name: 'OR', value: '$or' }, ], // ... and conditions conditions: [ { name: 'equal', value: '$eq' }, { name: 'is not equal', value: '$neq' }, { name: 'less than', value: '$lt' }, { name: 'less than or equal', value: '$lte' }, { name: 'greater than', value: '$gt' }, { name: 'greater than or equal', value: '$gte' }, ], };Then add the directive to your view:
<div query-builder="options"></div>You can now get the result as {{options.query}}
Templating
You can use your own template by setting a templateUrl in the directive:
<div query-builder="options" template-url="templateUrl"></div>or
$scope.options = { templateUrl: '/src/query-builder-group-directive.html', };The template needs to be recursive. You can have a look at the project one.
Build
Just run npm run dev to start webserver, and build everything with npm run build
Want to help?
- Fork it
- Create your feature branch (
git checkout -b my-new-feature) - Commit your changes using commitizen (
git commit -am 'feat: add some feature') - Push to the branch (
git push origin my-new-feature) - Create new Pull Request
