/angular-ui-query-builder

MongoDB format query-builder UI component for Angular

Primary LanguageJavaScriptMIT LicenseMIT

angular-ui-query-builder

MongoDB format query-builder UI component for Angular.

Demo.

Installation

  1. Grab the NPM
npm install --save @momsfriendlydevco/angular-ui-query-builder
  1. Install the required script + CSS somewhere in your build chain or include it in a HTML header:
<script src="/libs/angular-ui-query-builder/dist/angular-ui-query-builder.min.js"/>
<link href="/libs/angular-ui-query-builder/dist/angular-ui-query-builder.min.css" rel="stylesheet" type="text/css"/>
  1. Include the router in your main angular.module() call:
var app = angular.module('app', ['angular-ui-query-builder'])
  1. Use somewhere in your template:
<ui-query-builder query="$ctrl.myQuery" spec="$ctrl.mySpec"></ui-query-builder>

A demo is also available. To use this follow the instructions in the demo directory.

TODO

  • Basic field filtering
  • CSS tidyup
  • Compound queries - $or / $and
  • Automatically moving from a static string ($eq condition) to a multiple choice enum ($in) when a comma is used in a string
  • Convert string ENUMs to a $in type automatically
  • Number filtering - above, below, between
  • Date support - date selector, before, after
  • Nicer syntax support for $regexp
  • Support for $length
  • Nicer multi level path support