Salte Filter

Registers filter components allowing for a single input and output!

Install

You can install this package either with npm or with bower.

npm

$ npm install salte-filter

Then add a <script> to your index.html:

<script src="/node_modules/salte-filter/salte-filter.js"></script>

Or require('salte-filter') from your code.

bower

$ bower install salte-io/salte-filter

Then add a <script> to your index.html:

<script src="/bower_components/salte-filter/salte-filter.js"></script>

Example

Live Demo

Usage

<salte-filter data="myData" filtered-data="myFilteredData">
  <my-custom-filter></my-custom-filter>
</salte-filter>

Documentation

salteFilter must be required into your component in order to be used

(add/remove)Filter

• filter: A filter to be called anytime the filter function is called

const component = {
  require: {
    parent: '^salteFilter'
  },
  controller: () => {
    const view = this;

    view.filter = (item) => {
      // ... returns the item if the function returns truthy
    };

    view.$onInit = () => {
      // This will add the filter
      view.parent.addFilter(view.filter);
      // This will remove the filter
      view.parent.removeFilter(view.filter);
    };
  }
}

(add/remove)FilterListener

• listener: A listener to be called anytime the filter function is called

const component = {
  require: {
    parent: '^salteFilter'
  },
  controller: () => {
    const view = this;

    view.onFilter = (filteredData) => {
      // ...
    };

    view.$onInit = () => {
      // This will add the listener
      view.parent.addFilterListener(view.onFilter);
      // This will remove the listener
      view.parent.removeFilterListener(view.onFilter);
    };
  }
}

filter

Runs all of the filters, useful for triggering a filter when an input value is changed