Skip to content

Latest commit

 

History

History
34 lines (28 loc) · 917 Bytes

README.md

File metadata and controls

34 lines (28 loc) · 917 Bytes

Reactive One-way Data Binding using JS Setters

Instantiate a data binding model with optional name and and set up a subscriber.

import { Model } from './data-bind.js'
const model = new Model('my-model')

const subscriber = {
  value: 'nothing'
}

Define a property on the model and establish a one-way data binding to a property of the subscriber.

model.bind('someProperty', subscriber, 'value')

Each new assignment of the model's property is reflected to all its subscribers.

model.someProperty = 'hello' // subscriber.value === 'hello'
model.someProperty = 'world' // subscriber.value === 'world'
model.someProperty = '!'     // subscriber.value === '!'

The model also keeps track of all assigned values in a history.

console.log(model.history.someProperty)

Output:

['hello', 'world', '!']

For a working example with ui integration take a look at index.html.