Skip to content

Two-way data binding #32

Open
Open
@bsrdjan

Description

@bsrdjan

Thank you for all three sample apps (angular, react, vue), really helpful in evaluations and discussions,

Would it be possible to extend all three apps, with the two-way binding, even the simplest way?

Like for example: two text fields and one checkbox, which can be edited in UI, for view to model changes.
And one button, with the click logic to swap the text fields’ bound data values and toggle the checkbox bound data value, for model to view changes?

The reason I am asking is that two-way binding looks like a kind of challenge.

Angular tutorial

You can use two-way data binding with the following components: CheckBox, RadioButton, Input, DatePicker, Switch, TextArea. In order to use it, you have to use a library called Origami ...

React tutorial

Data binding not mentioned at all, only event binding. There are more possibilities in React, one could be shown as example.

Vue tutorial

v-model binding doesn’t work as expected for custom elements. In order to use two way data binding, you should bind and update the value yourself like this

<ui5-input
    :value="inputValue"
    @input="inputValue = $event.target.value">
</ui5-input>

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions