Localization with knockout
Localization with knockout.
HTML
<div>
<form>
<div>
<label for="name" data-bind="restext: 'name'"></label><br />
<input type="text" data-bind="value: name" />
</div>
<div>
<label data-bind="restext: 'email'"></label><br />
<input type="email" data-bind="value: email"/>
</div>
<div>
<label data-bind="restext: 'street'"></label><br />
<input type="text" data-bind="value: street"/>
</div>
<div>
<label data-bind="restext: 'zip'"></label><br />
<input type="text" data-bind="value: zip"/>
</div>
<div>
<label data-bind="restext: 'city'"></label><br />
<input type="text" data-bind="value: city"/>
</div>
<input type="submit" data-bind="resattr: { value: 'ok' }" />
</form>
<div data-bind="visible: name && city, reshtml: { key: 'welcome', params: { name: name, city: city } }">
</div>
</div>
JavaScript
var resources = {
ok: {
default: 'OK'
},
name: {
sv: 'Namn',
en: 'Name'
},
email: {
sv: 'E-post',
en: 'E-mail'
},
street: {
sv: 'Gatuadress',
en: 'Street address'
},
zip: {
sv: 'Postnr',
en: 'Zip'
},
city: {
sv: 'Stad',
en: 'City'
},
welcome: {
sv: 'Hej <strong>#name</strong>! Du bor i #city.',
en: 'Hello <strong>#name</strong>! You live in #city.'
}
};
function AppViewModel() {
var vm = {
name: ko.observable(),
email: ko.observable(),
street: ko.observable(),
zip: ko.observable(),
city: ko.observable()
};
ko.applyBindings(vm);
}
ko.applyBindings(new AppViewModel());