Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Support one-way data binding, and two-way data binding with HTML input elements #16

Open
Tal500 opened this issue Sep 5, 2021 · 0 comments

Comments

@Tal500
Copy link
Owner

Tal500 commented Sep 5, 2021

Support one-way data binding, and two-way data binding with HTML input elements.

It means that it bind the current value of an attribute to some settable expression.

If it is attached to an undefined reactive variable, it means that this is also the definition of this reactive variable.

One-way (a.k.a readonly) data binding should be in the form of attribute->(settable expression), which means that the settable expression will be updated whenever the attribute value gets changed.

Two-way data binding should be in the form of attribute<->(settable expression), which means that the settable expression will be updated whenever the attribute value gets changed and vice-versa.

This binding can be additionally be on the conditionality of the attribute, in the form of. attribute?<->(settable expression) (or attribute?->(settable expression) for one-way).
It can be additionally be bind both for the conditionally and the value of the attribute.

An attribute can be bounded only once per element, and can't be both defined manually and be bounded.

One-way data binding should be supported for the following attributes:

  • 'this' - a fake attribute which hold a DOM JS reference to the current element.
  • 'id' - a fake attribute which hold a DOM JS reference to the current element.
  • All the supported attrbiutes for two-way binding (in the next line)

Two-way data binding should be supported for the following attributes:

  • 'value' and 'checked' attribute for <input /> tags.
  • 'value' for <textarea> tag.
  • 'value' for <select> tag.

Additionally, as in svelte, we need the following:

  • Support bind:group for:
    • radio buttons (so it will notify the change of the value)
    • select tags?? (should we??)
    • For general grouping a list of checkbox in a resulted array.
  • In input tag, if the 'type' attribute expression is the string literal 'number' or 'range', the output value should be converted automatically to int (or float??? should support it then).
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant