Until we have an official async binding in V2, what would be the prefered way to bind async properties to a custom element (without using @zewa666´s plugin).
I am trying to bind data only via the view like <select-sub-organization subs.bind='this.organizationService.getAllSubOrganizations()' element.ref="selectSubOrganizationElement"></select-sub-organization>
but then i dont know, in what lifecycle-event in the custom element i should wait for the promise to resolve / how to override the binding context like “wait for it…then bind”
@zewa666
I have to be concerned about bundle size. But afaik, when using webpack, everything from rxjs but { Observable, Subscription } will be removed, right?
yes there are still some concerns around proper bundling and honestly I haven’t looked into them since v6. Here’s an issue I’ve found quickly googling. I’m sure there is a way to properly do so but it most likely requires some tweaking. Essentially the whole Angular crowd is running on Webpack and naturally using RxJS due to it being a dependency so I guess that must be doable.
The thing though is that if you solely need to bind to async promises you can just copy over the necessary part from the plugin to your own code and reuse it. It’s not more than this small BindingBehavior here. So just drop this part here related to observables and in the unbind section, add the Behavior to your own app and register globally and off you go.
thanks you very much for the detailed answer.
I didn´t know you could send links to lines w. github - very cool!
I have to admit, that i´ve tried the plugin this morning and couldn´t get it to work.
Installed the plugin and rxjs, bound globally and thought that <custom-element foo.bind="someMethodReturningAPromise() & async"></custom-element>
or <custom-element foo.bind="someMethodReturningAPromise() & async : {property : 'label'}"></custom-element>
would do, but sadly had no success.
Maybe next time i get grumpy for writing boilerplate in the VM just to show some delayed value, i´ll try again.
I have seen an issue where [i18n] custom attribute (from aurelia-i18n plugin) does not work in my custom elements because the plugin is (lazily) loaded after custom elements have been registered.
I used aurelia-async-binding in a past project and the [async] binding behavior worked fine for me, but I only used it with default HTML elements. Maybe give that a try?
It looks like there can be a much leaner async binding behavior implementation without rxjs but only supports promise. That might be a good feature in Aurelia 2 core.
The plugin itself doesnt really need rxjs aside from typings so if the provided value is duck-typed to an observable it can do the necessary steps even without the dependency
