Show:

Dropdown Filter

Use the dropdown filter globally. One way to do this is by setting up a computed property that returns an array of label/value objects.

export default Ember.Controller.extend({
 users: null,
 actions: {
   setIsAdminFilter(object) {
     if (object) {
       this.set('isAdminFilter', object.value);
     } else {
       this.set('isAdminFilter', null);
     }
   },
 },
 adminContent: Ember.computed(function() {
   return [
     {
       label: 'Yes',
       value: true,
     },
     {
       label: 'No',
       value: false,
     }
   ];
 }),
});
{{#ember-tabular-dropdown-filter filter=filter filterProperty="isAdmin" label="Is Admin" searchFilter=isAdminFilter}}
   {{#power-select
       options=adminContent
       selected=(find-by adminContent 'value' isAdminFilter)
       searchField="label"
       searchEnabled=false
       placeholder="Select to filter"
       onchange=(action "setIsAdminFilter")
       as |option|}}
           {{option.label}}
   {{/power-select}}
{{/ember-tabular-dropdown-filter}}

Methods

filterName

()
Constructs and sets the filter Object.

filterTable

()
Debounce the filterName method.

Properties

filter

Object
Must expose the filter property on the parent ember-tabular component to be able to pass the filter object back and forth between parent and child components.

Default: null

filterProperty

String
Property to be filtered upon.

Default: null

isClearable

Unknown

Default: false

query

Object
Pass the query object from the parent component if it is different or if used outside of the context of the component, otherwise query is optional and the component will attempt to grab within the context of the parent component.

Default: null

searchFilter

String
Value of filter.

Default: ''