KnockoutJS: fare clic sull'evento richiamato su each opzione in Seleziona

Voglio che Knockout chiamasse un evento each volta che l'utente fa clic su un'opzione in un elemento SELECT.

Ecco il mio JavaScript:

function ReservationsViewModel() { this.availableMeals = [ { mealName: "Standard (sandwich)", price: 0 }, { mealName: "Premium (lobster)", price: 34.95 }, { mealName: "Ultimate (whole zebra)", price: 290 } ]; } ko.applyBindings(new ReservationsViewModel()); 

Ecco il mio HTML:

 <select data-bind="foreach: availableMeals"> <option data-bind="text: mealName, click: alert('hello')" /> </select> 

Ma quando eseguo questa operazione, l'applicazione mostra "ciao" tre volte anche se nessuna delle opzioni è stata effettivamente cliccata.

Che cosa sto facendo di sbagliato?

Dovresti utilizzare la change binding anziché click e click optionsText invece di tag di option e utilizzare la function di change binding anziché call solo alert :

 <select data-bind="options: availableMeals, optionsText: 'mealName', value: selectedMeal, event: {change: onChange}"> </select> function Meal(name, price){ var self = this; self.mealName = name; self.price = price; } function ReservationsViewModel() { var self = this; self.availableMeals = ko.observableArray( [new Meal("Standard (sandwich)", 0), new Meal("Premium (lobster)", 34.95), new Meal("Ultimate (whole zebra)", 290)]); self.selectedMeal = ko.observable(self.availableMeals()[0]); self.onChange = function() { alert("Hello"); }; } ko.applyBindings(new ReservationsViewModel()); 

Ecco l'esempio di lavoro: http://jsfiddle.net/Q8QLX/

L'"avviso" dovrebbe essere incorporato in una function:

 <select data-bind="foreach: availableMeals, event: {change: function () { alert('hello'); } }"> <option data-bind="text: mealName " /> </select>