Btukfyl

Ember 2.17

I am calling an helper from my template :

{{#each invoice.invoiceLines as |line| }}

  {{pricings/full-pricing line.pricing}}

{{/each}}

invoice,invoiceLine, as well as pricing are ember models.

Here is how invoice is created in model () :

model(params) {

    let invoice= this.store.findRecord('invoice',params.invoice_id)

    return Ember.RSVP.hash({

      invoice: invoice,

      allShares: invoice.then((i)=>{return i.allShares()}),

      detailShares: invoice.then((i)=>{return i.detailShares()})

    });

  }

The goal of the helper is to take pricing, extract numbers (everything is in the model, no more relations) and return a string formatting the initial price and the subscription price.
The helper is as following :

import { helper } from '@ember/component/helper';



export function pricingsFullPricing([pricing]) {

  return pricing.then(

    p=>{

      debugger

    },p=>{



    }

  )

}

export default helper(pricingsFullPricing);

When I run the page, debugger is called twice (the template loop run once).

First time p is null, the second time it is a pricing.

Isn't then supposed to prevent that? Why does it behave like that?

Your route is wrong, routes are promise aware (that's what hash is for), it should be:

model(params) {

    return Ember.RSVP.hash({

      invoice: this.store.findRecord('invoice',params.invoice_id)

      //allShares: invoice.then((i)=>{return i.allShares()}),

      //detailShares: invoice.then((i)=>{return i.detailShares()})

    });

  }

Then your handlebars is just:

{{#each model.invoice.invoiceLines as |line| }}

  {{line}}

{{/each}}

You also shouldn't call methods like you are on a model. It's not really clear what allShares(), etc does but these should (probably) be computed in the controller. Something along the lines of:

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



export default Controller.extend({

   allShares:computed('model.invoice', function(){

       return this.get('model.invoice').allShares();

   });

});

Though this doesn't seem ideal. Like I said, it's hard to be explicit as it's not clear what your trying to do here. It'd probably make more sense if your extracted these methods into a service.

You then don't need the helper at all. This appears to be just trying to work around promises.

It makes life a lot easier if you try and load all server side data in the route before load.

First rule of helpers

Each time the input to a helper changes, the compute function will be called again.

Second, there's nothing about helpers that will make this block subsequent calls because you are returning a promise.

export function pricingsFullPricing([pricing]) {

  return pricing.then(

    p=>{

      debugger

    },p=>{



    }

  )

}

You've created a simple helper here that will use the promise itself as the value. Look at ember-promise-helpers/await to see how a class based helper is used to manually set the value that's displayed in the template.

Now, if you're wondering why the recomputation is happening, I'm going to have to speculate based off the knowledge I have of Ember data just from being part of the Ember community (I've never actually used Ember Data). You know line.pricing is a promise? I can then assume your using some sort of relationship, which will most likely have to be loaded via an ajax call (hence the promise). But these relationships in Ember data, iirc, use this PromiseProxyMixin that allow them to behave simultaneously like a promise or like an object (depending on whether the data is in the store already or not). This is what allows you to reference the promise in your template without then

See this article for a better understanding of what I mean