JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://knockoutjs.com/downloads/knockout-3.1.0.js"></script>
<select data-bind="options: availableCountries,
optionsText: function(item) {
return item.countryName + ' (pop: ' + item.countryPopulation + ')'
},
value: selectedCountry,
optionsCaption: 'Choose...'"></select>
JavaScript
var Country = function(name, population) {
this.countryName = name;
this.countryPopulation = population;
};
var AppViewModel = function() {
this.availableCountries = ko.observableArray([
new Country("UK", 65000000),
new Country("USA", 320000000),
new Country("Sweden", 29000000),
new Country("Sweden", 29000000)
]);
this.selectedCountry = ko.observable();
};
ko.applyBindings(new AppViewModel());