Data Attribute

Data dynamic binding
Will apply data-* attributes

Binding Data Attributes

This binding handler will attach any observable value to HTML data attribute. The attribute to bound to is choosed by adding suffix to bindable name.

For instance, applying binding named data.name will set HTML attribut data-name to passed observable value.

The following code:

<span data-bind="data.name: myObservable"></span>

Will result in element having data-name attribute added:

<span data-bind="data.name: myObservable" data-name="My Observable Value"></span>

Live Example

Results are not visible, try inspecting elements to verify that bindings have been applied.

Relevant code used in examples:

<span data-bind="data.title: binder.model.txt1.text" class="label label-success">Should have <code>data-title</code> HTML attribute of a simple string value</span>
<span data-bind="data.full: binder.model.txt1" class="label label-success">Should have <code>data-full</code> HTML attribute of json encoded object value</span>

<script>
	window.onload = (function () {­
		var data1 = {­
			text: 'Val1'
		­};

		binder.model.txt1 = new Maslosoft.Koe.TextValue(data1);

		ko.applyBindings({­model: binder.model­}, document.getElementById('ko-binder'));
	­});
</script>