Help understanding code


I was reading this: +,output and got really curious about the code in there:

<order-model get-list="{ period='previous_week' }" value:to="*previousWeek" />
<order-model get-list="{ period='current_week' }" value:to="*currentWeek" />

    <bit-c3-data-column key="Last Week" value:from="*previousWeek.totals" />
    <bit-c3-data-column key="This Week" value:from="*currentWeek.totals" />

There were two things I couldn’t quite understand:

  1. get-list="{ period='previous_week' }" what is get-list and what is that strange syntax on the right side? is it an object? if so does it mean I could have my-function-name="{ param1=this.var1 param2=this.var2}"?
  2. the use of * in the binding: I think it was previously explained to me that it had to do with some sort of “temporal” element to connect both the order-model with bit-c3-data-column without using a real property. There is an explanation here but still I barely understand how to use it and its benefits.



Hi @nriesco, sorry it took so long to get a response!

  1. get-list is something special to can-connect, so it’s not a thing you can use elsewhere. You can see its code here:

You can use hash expressions to make something like on:click="myFunction(param1=var1 param2=var2)" call myFunction({param1: var1, param2: var2})

  1. * (in CanJS 3) can be used to take a value from a child component and make it usable elsewhere in the template. You can always do that by creating a property in the template for the view model, but with * you don’t have to create that extra property. These docs have a little more info:

We’re deprecating the * syntax in CanJS 4 so that it’s more clear what’s going on. You can start using scope.vars to accomplish the same thing in can-stache 3.11+

Hope that helps,


Thanks a lot @chasen

Just to be sure, this <order-model get-list="{ period='previous_week' }" value:to="*previousWeek" /> is equivalent to have a getter in the viewmodel that calls the getList method (returns a Promise) with params defined as { period='previous_week' } ?


Yup, that seems right to me!