These are chat archives for canjs/canjs

17th
Dec 2018
Matthew Phillips
@matthewp
Dec 17 2018 13:28
I believe you have to include babel-polyfill to use async functions.
qantourisc
@qantourisc
Dec 17 2018 13:38
@justinbmeyer i don't get how to use your component constructors practically
Justin Meyer
@justinbmeyer
Dec 17 2018 14:14
@qantourisc the modal recipe shows how they are used
I think the routing guide does too
Frank Lemanschik
@frank-dspeed
Dec 17 2018 16:36
@qantourisc i can clarify that
there are 2 ways this constructors get used
first way is .stache template references them via can-import or you do it your self
const HelloWorld = Component.extend({
    tag: "hello-world",
    view: `
        <can-slot name="greetingTemplate" />
        <content>world</content>
        <ul>{{#each(items)}} {{this}} {{/each}}</ul>
    `,
    ViewModel: {
        items: {}
    }
});

// Create a new instance of our component
const componentInstance = new HelloWorld({

    // values with which to initialize the component’s view model
    viewModel: {
        items: ["eat"]
    },

    // can-stache template to replace any <content> elements in the component’s view
    content: "<em>{{message}}</em>",

    // <can-template> strings rendered by can-stache with the scope
    templates: {
        greetingTemplate: "{{greeting}}"
    },

    // scope with which to render the <content> and templates
    scope: {
        greeting: "Hello",
        message: "friend"
    }
});

myGreetingInstance.element; // is like <my-greeting>Hello <em>friend</em> <ul> <li>eat</li> </ul></my-greeting>

myGreetingInstance.viewModel; // is HelloWorld.ViewModel{items: ["eat"]}
this is a defined helloworld component
that gets Loaded aka Instance creation of the constructed component
new HellWorld
is the key part
the part after that is supplying inital values
Paul Tichonczuk
@tracer99
Dec 17 2018 16:44
Working on a Canjs 2->3 migration. Running into an issue where jQuery is complaining about route binding syntax
Error: Syntax error, unrecognized expression: /:service
Did we miss something? Is this syntax depricated?
Chasen Le Hara
@chasenlehara
Dec 17 2018 17:59
@tracer99 That’s for something like route.register('/:service'), right?
As far as I know, we’re showing /{service} in our docs since 3.x (and we do show a warning) but we haven’t removed the old colon syntax.
Paul Tichonczuk
@tracer99
Dec 17 2018 18:10
   '/:service route': function(urlContext) {
                this.login(urlContext);
                if (urlContext.service == 'logout') {
                    route.attr({}, true);
                }
            },
It's a route change binding in a controller.
yeah, that syntax doesn't work either (different error)
Chasen Le Hara
@chasenlehara
Dec 17 2018 18:13
Hm, I’m not sure, let me check with @justinbmeyer or @phillipskevin
Matthew Phillips
@matthewp
Dec 17 2018 19:45
canjs 5.20.0 is out, adding support for portals: https://github.com/canjs/canjs/releases/tag/v5.20.0
Justin Meyer
@justinbmeyer
Dec 17 2018 20:24
@tracer99 howdy ... so the app is using the old can-control-route stuff?
Gregg Roemhildt
@roemhildtg
Dec 17 2018 21:16
:+1: on 5.20 portals. Good solution for a common problem
Matthew Phillips
@matthewp
Dec 17 2018 21:19
Thanks!
Justin Meyer
@justinbmeyer
Dec 17 2018 21:21
@roemhildtg besides modals, what else might you need it for?