Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Repo info
Activity
  • Jan 21 14:21
    frank-dspeed commented #5460
  • Jan 21 14:13
    frank-dspeed commented #5460
  • Jan 21 14:12
    frank-dspeed commented #5460
  • Jan 21 14:10
    frank-dspeed commented #5460
  • Jan 21 13:37
    jvkdev starred canjs/canjs
  • Jan 21 13:36
    justinbmeyer commented #5460
  • Jan 21 06:45
    frank-dspeed commented #5460
  • Jan 21 06:42
    frank-dspeed edited #5460
  • Jan 21 06:41
    frank-dspeed opened #5460
  • Jan 20 21:58
    justinbmeyer commented #5459
  • Jan 20 07:49
    frank-dspeed opened #5459
  • Jan 19 16:39
    leoj3n commented #5107
  • Jan 19 16:37
    leoj3n commented #5107
  • Jan 19 16:32
    ThomasBrickerBK starred canjs/canjs
  • Jan 18 01:06
    greenkeeper[bot] commented #5422
  • Jan 18 01:06

    greenkeeper[bot] on @feathersjs

    chore(package): update @feather… (compare)

  • Jan 18 00:48

    greenkeeper[bot] on @octokit

    (compare)

  • Jan 18 00:46

    greenkeeper[bot] on @octokit

    chore(package): update @octokit… (compare)

  • Jan 17 18:14
    patosullivan starred canjs/canjs
  • Jan 17 17:42
    bmomberger-bitovi synchronize #5451
Chris
@chrischrischris
Hi, I'm trying out canjs for the first time and really enjoying it, however I've got a simple problem that I can't find an answer to: I have a Component that uses a .stache template loaded using can.view. The data for the component is loaded in the viewModel using articles: Article.findAll(). In my template I'm using {{#each articles}} but I get a "TypeError: Cannot use 'in' operator to search for 'xxx' in pending" which is happening as it's trying to render before the data is loaded. Any simple pointers for me?
Also interestingly if I don't use a property within the {{each}} loop, it loops 9 times before any data is even loaded
Chris
@chrischrischris
And of course, once I ask for help online, I figure it out myself =). I've got it going thanks to the can.List.promise docs
Mohamed Cherif Bouchelaghem
@cherifGsoul
@chrischrischris nice
Chris
@chrischrischris
New question: I have a Model that pulls data from a rest api using findall, and also have a define property defined in the model instance that is a computed property from the rest data. I want to pass this define property to sub-component, but the value is never passed (using {subComponentProp}="definedProperty". I can see the correct value in the parent component - and in the console the property is visible via attr('definedProperty'), but not via .definedProperty. Any ideas how I can pass this value to the subcomponent?
Thomas Sieverding
@Bajix
Markup?
Chris
@chrischrischris
@Bajix - is that in response to my question? I don't follow what you mean by Markup?
Thomas Sieverding
@Bajix
Oh so you need to use .attr to read computed values
Chris
@chrischrischris
yes and that works, but I can't figure out how to pass that value in the stache template
Thomas Sieverding
@Bajix
{title}=“page.title"
That’ll set viewModel.title whenever page.title is changed
Oh you probably have a capitalization issue
The attribute name needs to be lowercase
{sub-component-prop}=“myModel.computedProperty"
kebab case -> camel case
kabab case = snake case w/ dashes instead of underscores
Chris
@chrischrischris
Code Exerpt:
{{#each articles}}
    <p>This works: {{previewImgURL}}</p>
    <!-- passing in previewImgURL doesn't work below -->
    <article-tile {imageURL}="previewImgURL" {articleTitle}="title" />
{{/each}}
Thomas Sieverding
@Bajix
That’s incorrect
{{#each articles}}
    <p>This works: {{previewImgURL}}</p>
    <!-- passing in previewImgURL doesn't work below -->
    <article-tile {image-url}="previewImgURL" {article-title}="title" />
{{/each}}
Chris
@chrischrischris
ok, i'll try - but articleTitle works (2nd param)
Thomas Sieverding
@Bajix
imageURL isn’t a good property name, as it can’t be converted sanely between different casing
You should do imageUrl instead so that your attribute would be {image-url}=“{post.imageUrl}"
Possibly, I hadn’t played around with type sensitivity w/ the new binding syntax
AFAIK attribute names shouldn’t contain capitalized letters
Chris
@chrischrischris
ok yep - thanks so much! I didn't see anything about casing / kebab casing in the docs anywhere
but that was the issue. Been banging my head on the keyboard for a while so I really appreciate the help
Thomas Sieverding
@Bajix
Yea, I believe it’s mentioned in there somewhere, but not sure where
All of their examples use kebab casing at the very least
Chris
@chrischrischris
yeah - i think the fact that articleTitle was working for me made it that much harder to suspect that
Thomas Sieverding
@Bajix
Yea, and it’s only the attribute name that’s type sensitive
Oh they probably do that because attribute names are case insensitive, so FooBar===foobar
Chris
@chrischrischris
ah ok, that makes sense
Viktor Busko
@Lighttree

https://canjs.com/docs/can.view.bindings.twoWay.html

Someone know why can throw warning on this page ? (in console)
WARN: can/view/stache/mustache_core.js: Unable to find key or helper "plateName". Because I have same warnings in my code and can't find the reason. There is also another case when I have different Issue with WARN: can/view/scanner.js: No custom element found for my-parent-component-tagMaybe some updates in Can ?

Mohamed Cherif Bouchelaghem
@cherifGsoul
@Lighttree you use can.jquery.dev.js
if so just use can.jquery.js
for the first check if you have plateName in your viewModeland the later check the component tag existance
Justin Meyer
@justinbmeyer
@Lighttree are you using Mustache on purpose?
you should use stache if you can
The reason you'll see those warnings are because:
  1. you have something like {{plateName}}, but there's no object with a plateName property defined in the scope. This can be ok. It's just a warning. In those cases, it's faster if you do something like {{./plateName}}. Giving a hint on where to look speeds up the bindings.
2. At the time of running the template, there's no my-parent-component-tag component defined.
Mohamed Cherif Bouchelaghem
@cherifGsoul
@justinbmeyer How we can know that mustacheis used here?
Justin Meyer
@justinbmeyer
can/view/scanner is not used by stache.
Mohamed Cherif Bouchelaghem
@cherifGsoul
ok thank you
Viktor Busko
@Lighttree

@justinbmeyer
"are you using Mustache on purpose?" I am not :)
All my components generated by DoneJS generator (and all the templates are .stache), so not sure what can cause mustache processing.
What I'm trying to do is repeat behaviour from the end of this video: https://www.youtube.com/watch?v=mKOwwcKRBic (Share value between 2 components).

This is template for "parent" component that should import 2 others and child components should share data between each other.

<can-import from="trialsetup/components/user-edit-form/user-edit-form" />
<section class="container">
  <header class="row">
    <div class="col-md-12">
      <h1>Lets get you set up with recognition</h1>
      <p class="lead">Add your details below</p>
    </div>
  </header>
  <main class="row">
    <div class="col-md-7">
      <gf-user-edit-form></gf-user-edit-form>
    </div>
    <div class="col-md-5">
      Placeholder for the second component
    </div>
  </main>
</section>

So I'm going to use reference binding here like "*myReference"But as soon as I add input with 2-way binding to "user-edit-form" template:

<input type="text" name="name" {{$value}}="message">

It throws me WARN: can/view/scanner.js: No custom element found for gf-step-admin-setup

gf-step-admin-setup- actually "parent" component (you can find its template above) so looks like it have to exist when I import another component. (unless there is some tricky life-cycle)

The fun thing that I can see my template with input for a second but after that something happens it disappear from the page :)

f I'll change binding to something like that:

<input type="text" name="name" {$value}="message">

It will work, but this is not what I need :(

Mohamed Cherif Bouchelaghem
@cherifGsoul
@Lighttree can you ask the question in donejs chat room? https://gitter.im/donejs/donejs
Mohamed Cherif Bouchelaghem
@cherifGsoul

It will work, but this is not what I need :(

@Lighttree what you mean by this?

Viktor Busko
@Lighttree

@Lighttree what you mean by this?

It will render the component without issues but I need 2-way binding here. I'll try to go with CanJS only and check if it will work.

Mohamed Cherif Bouchelaghem
@cherifGsoul
this sentence: "it will work, but this is not what I need"
Viktor Busko
@Lighttree
whats wrong with it ? :)