Enhance in Au 1 vs 2

I’m using a Stencil component library to compose different framework components into an existing Stencil component.

In Aurelia 1, it’s pretty trivial:

this.templatingEngine.enhance({element: document.getElementById(id), bindingContext: {model}});

When I try to accomplish something similar in Aurelia 2, I get an error:

Aurelia.enhance({host: document.getElementById(id), component: SimpleComponent });

The error:

Uncaught (in promise) Error: Invalid surrogate attribute: id

I know everything won’t be the same, but I was hoping it’d be this simple. Is there a different way in 2?

1 Like

I should eventually be as simple as v1: any piece of templating can be enhanced. Or it can read as composition using any kind of template & view model. For now, we don’t have it yet. For the error you got, it’s mainly for a fullblown CE compilation.
Can you help create a ticket to track this?

@m0ngr31 in the meantime you can do it like this aurelia-mdc-web/mdc-dialog-service.ts at 77abb13af1aec17e1cc1af2c7be1be194a8a90f8 · aurelia-ui-toolkits/aurelia-mdc-web · GitHub

1 Like

Okay that’s good to know. What’s the best repo to do this?

1 Like

I’ll look at this in the morning. Thanks!

1 Like