Last active
December 15, 2015 14:13
-
-
Save jeremija/96980c6cda322c51b4f3 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!-- updating input will update automatically update span --> | |
<input type="text" data-bind="value: observable"> | |
<span data-bind="text: observable"></span> | |
<!-- iterate over observableArray --> | |
<ul data-bind="foreach: observableArray"> | |
<li data-bind="text: $data"></li> | |
</ul> | |
<input type="text" data-bind="value: x"> | |
<input type="text" data-bind="value: y"> | |
<button data-bind="click: add">+</button> | |
<button data-bind="click: subtract">-</button> | |
<Calc params="x: myX, y: myY, result: myResult"></Calc> | |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
ko.bindingHandlers.myValue = { | |
init: function(element, valueAccessor) { | |
if (!ko.isObservable(valueAccessor())) return; | |
var observable = valueAccessor(); | |
function update() { observable(element.value); } | |
element.addEventListener('change', update); | |
ko.utils.domNodeDisposal.addDisposeCallback(element, function() { | |
element.removeEventListener('change', update); | |
}); | |
}, | |
update: function(element, valueAccessor) { | |
element.value = ko.unwrap(valueAccessor()) || ''; | |
} | |
}; | |
ko.bindingHandlers.yourBindingName = { | |
init: function(element, valueAccessor, allBindings, viewModel, bindingContext) { | |
// This will be called when the binding is first applied to an element | |
// Set up any initial state, event handlers, etc. here | |
}, | |
update: function(element, valueAccessor, allBindings, viewModel, bindingContext) { | |
// This will be called once when the binding is first applied to an element, | |
// and again whenever any observables/computeds that are accessed change | |
// Update the DOM element based on the supplied values here. | |
} | |
}; | |
function fcn(params) { | |
function add() { | |
return params.x + params.y; | |
} | |
return { | |
x: params.x, | |
y: params.y, | |
add: add | |
}; | |
} | |
function fcn({ x, y }) { | |
const add = () => x + y; | |
return {x, y, add}; | |
} | |
// create an observable with default value | |
var name = ko.observable('John'); | |
// get the current value | |
name() // returns 'John' | |
// set a new value | |
name('James') | |
// get the value again | |
name() // returns 'James' |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment