[Feature] Support default binding mode for html only components

[michaelw85]

I'm submitting a feature request

• Library Version: 1.10.0

Please tell us about your environment:

• Operating System: Windows 10

• Node Version: 10.15.1

• NPM Version: 6.9.0

• Browser: all

• Language: all

Current behavior: Settings default binding mode requires a class using the decorator.

Expected/desired behavior: Expected to be able to set a default binding mode on view only custom elements in html

• What is the motivation / use case for changing the behavior? I find the ability to create (simple) view only components very powerfull and satisfying in Aurelia. I'm working on a component library and the most basic components are mostly only templates wrapping native elements and exposing bindable attributes. For a radio or checkbox group passing the checked binding required a 2 way binding to be useful, by default it's a one way. Having to create a class with a single bindable is a shame its so much cleaner to just have the html file only.

Here's an old PR introducing the functionality: https://github.com/aurelia/templating-resources/pull/309

[bigopon]

cc @EisenbergEffect

[EisenbergEffect]

@bigopon I think we should implement this in vNext first, as part of the template parser. Then, once we've got all the details settled, port it back to vCurrent. My thinking is that this will give us a better chance of remaining forward/backward compatible with the new feature. We also may be able to do more in vNext and that might give us a clearer picture of what subset is doable with vNext.

[EisenbergEffect]

We should support both types and default binding modes. Prefer a syntax that matches TypeScript for the type part. Maybe it's something like myProperty: number & twoWay. (Probably need to differentiate int and float actually.)

[michaelw85]

@EisenbergEffect I like the format @bigopon already used in his initial PR. Only thing I would like to suggest is to match the template spinal case notation of the binding mode. I think this would be intuitive since you are already in the html context.

<template bindable="myProperty: number & two-way">
...
</template>

Alternatively we could match the html format like so: myProperty.to-way: number

We should support both types and default binding modes.

I think this is great and would love to have both but from a development point of view these are separate features in my opinion.