5
votes

I have a computed property on a model and in order to compute that I need a property from a controller (not the one that is controlling the model). I know there is needs: but this is just on
a controller level.
How could I get a property in Ember from a controller other than the one that is managing the model?

I'm trying to do some formatting like the person that [asked this question][1] but I didn't succeed what has been suggested there.
So I try to do the formatting on the model with a computed property, but to calculate that property I need another property from a controller.

Any help is greatly appreciated! Thanks!

Note: I'm using EmberData to manage the model.

Edit:
In order to clarify what I'm trying to do I have set up an example that shows the problem
in a general way: The example application lets you input numbers, store them,
and show them in a list. You can also input a "conversion factor" which doesn't change the model data itself but the presentation on the template. Say, you input the number 2, 2 gets saved on the model but when it is shown in the list it gets "formatted" with the conversion factor you entered previously and the calculated value is shown in the template. The problem is that the value with which I want to format is stored on a different controller. Here's what I have tried so far:

  • #1 Approach:
    Computed Property on the ArrayController - using needs: in the controller to traverse and get the value
    -->jsfiddle
    Problems I have encountered:
    The ArrayController seems to break and the template renders as if there are no stored records at all (Note: the example uses local storage, so create some records and uncomment the computed property on the ArrayController and you'll see it works originally as expected and shows the records you entered).

  • #2 Approach:
    Computed Property on model itself
    -->jsfiddle
    Problems I have encountered:
    I have no idea how I can get a property from a controller while beeing inside the model

  • #3 Approach:
    Handlebars Helper and needs: on the controller
    1) Define a computed property on the controller (that handles the model) to get the value in question from the other controller
    2) create a handlebars helper and pass in the value from the model and the value from the controller and return the calculated value
    -->jsfiddle (You can find the link for the 3rd jsfiddle in the comments since I don't have enough reputation points yet).
    Problems I have encountered:
    Instead of displaying the formatted number I get "NaN" on every value in the rendered template.

If anyone has an idea how to solve this or can point me into the right direction would be great. Your help is really appreciated! Thanks for your time!

2
can you setup a jsbin of jsfiddle with what you have already tried? this will be a lot easier to help outintuitivepixel
Link for the 3# Approach: jsfiddleNairam

2 Answers

10
votes

Accessing any controller from a model is really going against the grain of Ember's architecture. Most formatting problems are best solved with a Handlebars helper, but if you need to combine data from the controller and model in a really serious way, then you probably want a computed property on the controller.

Can you give a concrete example of what you're trying to do? That will make it a lot easier to suggest the right solution.

1
votes

I got it working: I've used the #3 Approach (outlined in my question).

  • I'm using a computed property to proxy the value from the other controller to the controller that is bound to the template where I want to display the formatted value
  • I created a handlebars helper called converted that will do the formatting. The handlebars helper accepts two parameters: the value that I proxy from the controller (which in turn comes from a different controller) and the value from the model.

The thing that didn't work previously was that in the template when using the helper I would get "NaN" on all items instead of the formatted output.
What solved the problem was that instead of lopping through the model in the template with:

    {{#each controller}}
    <tr>
        <td>{{converted amount conversionFactor}}</td>
    </tr>
    {{else}}
    <tr>
        <td>No amounts here yet</td>
    </tr>
    {{/each}}

I changed it to this:

    {{#each item in controller}}
    <tr>
        <td>{{converted item.amount conversionFactor}}</td>
    </tr>
    {{else}}
    <tr>
        <td>No amounts here yet</td>
    </tr>
    {{/each}}

and it works perfectly!

Here's the working jsfiddle