CODEWITHSUNDEEP
javascriptember.js
Damian Zawadzki
Damian Zawadzki

Reputation: 33

Filtering each by category in model - ember.js

According to title - how I can make that happend?

So I have models/project

export default DS.Model.extend({
    title: DS.attr('string'),
    description: DS.attr('string'),
    image: DS.attr('string'),

    category: DS.attr('string')  
});

And I want to filter items by category string in projects/index.hbs

{{#each project in model}}
    <h3>{{project.title}}</h3>
    <p>{{project.description}}</p>
{{/each}}

...

{{#each project in model}}
    <h3>{{project.title}}</h3>
    <p>{{project.description}}</p>
{{/each}}

For example some projects have category web and the others have logo

In first {{#each}} loop I wanna display web category and logo in the second.

Should I do that by controller? or in the route? PS. What to do to make it appear as default, not by clicking to make action: sortBy etc. I really tried find the answer by myself but nothing yet..

Upvotes: 0

Views: 107

Answers (1)

saygun
saygun

Reputation: 1438

You can add computed property to your controller which filters your projects by category.

  webCategoryProjects: function() {
    return this.get('model').filterBy('category', 'web');
  }.property('[email protected]'),

  logoCategoryProjects: function() {
    return this.get('model').filterBy('category', 'logo');
  }.property('[email protected]'),

{{#each project in webCategoryProjects}}
    <h3>{{project.title}}</h3>
    <p>{{project.description}}</p>
{{/each}}

...

{{#each project in logoCategoryProjects}}
    <h3>{{project.title}}</h3>
    <p>{{project.description}}</p>
{{/each}}

Upvotes: 2

Related Questions