These are chat archives for canjs/canjs

3rd
Aug 2018
Ivo Pinheiro
@ivospinheiro
Aug 03 2018 11:29
Hi all!
I have a question. Is "data" somehow reserved word on stache for can@3.13.1?

I have adjusted the TodoMVC example to show the error I'm having.
This one is working with "__data" property being bound to todo-list component:
https://jsbin.com/razoyejili/1/edit?html,css,js,output

But this one is not working, binding "data" property to todo-list component :
https://jsbin.com/razoyejili/1/edit?html,js,output

It only works if I change the bind to "./data":
https://jsbin.com/heviwoyayu/1/edit?html,js,output
Viktor Busko
@Lighttree
Aug 03 2018 12:39

@Lighttree this helper is getting a little crazy... but you can do something like this:

stache.addHelper('i18nDF', (prop) => {
  const placeholder = document.createTextNode('');

  setTimeout(() => {
    const tpl = document.createElement('template');
    tpl.innerHTML = prop;
    placeholder.parentNode.replaceChild(tpl.content, placeholder)
  }, 1000);

   return placeholder;
});

@phillipskevin oh this is really good solution. Like it.

Here is another that we found yesterday, but it require some canjs stuff:

https://codepen.io/Lighttree/pen/zLjwPB?editors=1010

Gregg Roemhildt
@roemhildtg
Aug 03 2018 13:06
@ivospinheiro there was a bug a while back...it might have been with data
Ivo Pinheiro
@ivospinheiro
Aug 03 2018 13:29
Thanks @roemhildtg!
Gregg Roemhildt
@roemhildtg
Aug 03 2018 13:29
no problem!
Ivo Pinheiro
@ivospinheiro
Aug 03 2018 13:30
So it seems that with canjs@3 I have to use the workaround
Gregg Roemhildt
@roemhildtg
Aug 03 2018 13:34
Yeah. Its a pretty easy workaround
Or update to 4.
Ivo Pinheiro
@ivospinheiro
Aug 03 2018 15:02
Hopefully I will upgrade to 4.
Right now, I'm incrementally upgrading the application.
So, first I'm upgrading to the latest can@3 version
Matthew Phillips
@matthewp
Aug 03 2018 15:31
Ivo Pinheiro
@ivospinheiro
Aug 03 2018 15:53

One question
If I have this on stache:

{{#data}}
  <dummy-component data:from="./data"/>
{{/data}}

Does data property from dummy component is bound to "data" or is it bound to "data.data"? Does the scope changes with {{#data}}?

Gregg Roemhildt
@roemhildtg
Aug 03 2018 15:56

I believe you would want to do this:

{{#if(./data)}}
  <dummy-component data:from="./data"/>
{{/if}}

to be very clear about what data you're accessing

Matthew Phillips
@matthewp
Aug 03 2018 16:20
@ivospinheiro that would be data.data there
#data changes the scope
you could also do data:from="scope.vm.data" assuming data is on the component viewmodel
Ivo Pinheiro
@ivospinheiro
Aug 03 2018 16:23
Thanks @matthewp I've meanwhile understood that
Because usually {{#something}} is also used to iterate through arrays/Lists and then the scope is changed to the current array/List item
Matthew Phillips
@matthewp
Aug 03 2018 16:30
yeah
Ivo Pinheiro
@ivospinheiro
Aug 03 2018 16:34
One question.
I'm upgrading an application to use the latest can@3 version, but I don't know exactly why but the source-maps are not working as expected
When I place a breakpoint on file.js!eval file the chrome developer tools redirects me to a different original file
Matthew Phillips
@matthewp
Aug 03 2018 16:38
you're using steal I presume?
Ivo Pinheiro
@ivospinheiro
Aug 03 2018 16:38
yes
Matthew Phillips
@matthewp
Aug 03 2018 16:38
It takes you to a different file entirely?
Ivo Pinheiro
@ivospinheiro
Aug 03 2018 16:39
exactly
Matthew Phillips
@matthewp
Aug 03 2018 16:39
hm
Ivo Pinheiro
@ivospinheiro
Aug 03 2018 16:39
I'm using steal@1.6.2 right now
Matthew Phillips
@matthewp
Aug 03 2018 16:39
I recall someone else having a similar problem in the past
Ah
let me look at some commits real quick
Ivo Pinheiro
@ivospinheiro
Aug 03 2018 16:39
ok
Matthew Phillips
@matthewp
Aug 03 2018 16:40
Is this in dev mode?
Ivo Pinheiro
@ivospinheiro
Aug 03 2018 16:40
yes
Matthew Phillips
@matthewp
Aug 03 2018 16:45
I asked a colleague about it
You might try upgrading, I know I worked on a similar problem at some point in the last few months
Eben
@eben-roux
Aug 03 2018 16:46
@phillipskevin thanks for the feedback Kevin, I'll have a look at the on:enter code.
Ivo Pinheiro
@ivospinheiro
Aug 03 2018 16:46
This problem is a little annoying because I had to disable the source-maps in order to be able to debug my code
Thanks @matthewp I will wait for more news about this issue
Matthew Phillips
@matthewp
Aug 03 2018 16:49
yeah of course
did you try inserting a debugger; ?
Some times that works better than clicking with source maps
Ivo Pinheiro
@ivospinheiro
Aug 03 2018 16:54
Yes, but it forces me to refresh the browser each time I have to change/add a breakpoint
gregorgodoy
@gregorgodoy
Aug 03 2018 19:51

Hi! how can I attach an model Instance to the value property from an option tag while looping a list? Like this:

<select class="form-control" value:bind="product">
{{#if(products.isResolved)}}
    {{#each(products.value)}}
        <option value="{{.}}">{{product_name}}</option>
    {{/each}}
{{/if}}
</select>

Is this posible? thanks for any hint

products is a Promise that resolves to a List and product should be the "selected" product
gregorgodoy
@gregorgodoy
Aug 03 2018 20:07
Canjs 5
Ivo Pinheiro
@ivospinheiro
Aug 03 2018 22:22
@matthewp I've upgraded to latest steal version steal@2.1.1 and the source-maps seems to be working fine
Thanks
Nico R.
@nriesco
Aug 03 2018 23:51

The on:enter now works, but the input is inside a form, so the submit is also fired. How can i prevent this from bubbling to the form element? I already tried scope.event.preventDefault() and scope.event.stopPropagation()
Of course I could do some logic inside the submit an prevent the submition on some conditions, but how can I prevent the bubbling so the submit is never fired? Thanks!

@gregorgodoy did you make this work? I guess removing the form is not an option.