Ember filter by has-one relationship in component

Questions General
1

I have two models company and companyAdminInfo and every company has one companyAdminInfo (as seen in these pictures).

Unbenannt-1
Unbenannt-11417×1080 158 KB

Now I have a template where I want to see all companies but filter them before by attributes of companyAdminInfo e.g. company.companyAdminInfo.billable == true.

This is the route which defines /companies (it’s in the picture above, I can only upload one picture)

From there I’ll take model and I get it in my component as companies (component is also seen in the picture above) This works, I’m able to filter company.name == ‘test’, also company.companyAdminInfo != null works (meaning every company has a companyAdminInfo). But filtering by company.companyAdminInfo.billable won’t work anymore. company.companyAdminInfo.billable == null however returns all entries (but billable, as seen in the database or in the ember developer tool, is in all entries either true or false).

I’ve tried different soultions like changing the route or the filter statement but nothing works. I thank you in advance for your help.

2

what happens if you change your computed property to just:

import { filterBy } from '@ember/object/computed';

...
  billableCompanies: filterBy('companies', 'companyAdminInfo.billable', true),
...

My guess is that your CP isn’t set up to observe the right paths for changes, and also your relationship is async so you’re dealing with proxies which may not have resolved the first time it is computed

Also using the computed macros like I did above is nice and short and easier to read imo so I’d recommend using them when you can

1 Like
3

Thank you, it was the async thing. I tested it with a filter action, which I triggered after all data was loaded. Which ist the best solution for loading the computed value after all data was loaded. Should I do this with ember-concurrency and in the route or in the component?

4

Complicated answer… if your backend supports sideloading, it’s often preferable to load relationships along with primary records, in fact many have discussed making ember data relationships sync by default, meaning you MUST sideload related records. If not that then loading relationships in routes is a good choice because the routing system is built to resolve async state before anything is rendered. But sometimes it’s preferable to load async data in components in which case I personally would always reach for ember-concurrency, it helps you replace what the ember routes are responsible for (error, loading, cancellation, etc).

1 Like