title: Filtering an array in ember
body: <p>Ok so I'm fairly new to programing, I know how to run a filter on a JSON Array but I cant seem to figure it out when I'm pulling the data from firebase and viewing it in an Ember app.</p>
  
  <p>this is my route.js code:</p>
  
  <pre><code>    import Ember from 'ember';
  
      export default Ember.Route.extend({
        model: function() {
          return this.store.findAll('user');
        }
      });
  </code></pre>
  
  <p>This is my template.hbs code the href="#!" is the generic from materialize for the dropdown buttons:</p>
  
  <pre><code>    &lt;div class="list-wrapper col-xs-10 col-xs-offset-1"&gt;
          &lt;div class="col-xs-12 button-div"&gt;
             {{#md-btn-dropdown text='Filter' class="col-xs-2"            belowOrigin=true}}
                 &lt;li&gt;&lt;a href="#!"&gt;Female&lt;/a&gt;&lt;/li&gt;
                 &lt;li&gt;&lt;a href="#!"&gt;Male&lt;/a&gt;&lt;/li&gt;
                 &lt;li&gt;&lt;a href="#!"&gt;All&lt;/a&gt;&lt;/li&gt;
             {{/md-btn-dropdown}}
          &lt;/div&gt;
          {{#each model as |info|}}
          &lt;div class="col-xs-3 user-card"&gt;
             &lt;div class="card-info"&gt;
                 &lt;ul&gt;
                     &lt;li&gt;Last Name- {{info.lastName}}&lt;/li&gt;
                     &lt;li&gt;First Name- {{info.firstName}}&lt;/li&gt;
                     &lt;li&gt;Gender- {{info.gender}}&lt;/li&gt;
                     &lt;li&gt;&lt;a href="mailto:{{info.email}}"&gt;{{info.email}} &lt;/a&gt;&lt;/li&gt;
                 &lt;/ul&gt;
             &lt;/div&gt;
         &lt;/div&gt;
         {{/each}}
      &lt;/div&gt;
      {{outlet}}
  </code></pre>
  
  <p>This is my controller.js code which I no is all wrong:</p>
  
  <pre><code>    import Ember from 'ember';
  
      export default Ember.Controller.extend({
        customFilter: function(gender) {
           return function(el) {
              var r = el.user;
              return r.gender === gender;
           };
        }
      });
  </code></pre>
  
  <p>and this is my model:</p>
  
  <pre><code>    import DS from 'ember-data';
      import Ember from 'ember';
  
      export default DS.Model.extend({
        lastName: DS.attr('string'),
        firstName: DS.attr('string'),
        gender: DS.attr('string'),
        email: DS.attr('string')
      });
  </code></pre>
  
  <p>I've searched high and low and I'm sure I'm just missing something basic and stupid. What I want is for the dropdown menu to be able to filter and display only female, male or all. Again I'm new to this stuff so I apologize if this is a pretty basic thing. Thank You</p>