我有这个工作的JS：
$(function() {
// Class to represent a row in the seat reservations grid
function SeatReservation(name, initialMeal) {
var self = this;
self.name = name;
self.meal = ko.observable(initialMeal);
self.formattedPrice = ko.computed(function() {
var price = self.meal().price;
return price ? "$" + price.toFixed(2) : "None";
});
}
// Overall viewmodel for this screen, along with initial state
function ReservationsViewModel() {
var self = this;
// Non-editable catalog data - would come from the server
self.availableMeals = [
{ mealName: "Standard (sandwich)", price: 0 },
{ mealName: "Premium (lobster)", price: 34.95 },
{ mealName: "Ultimate (whole zebra)", price: 290 }
];
// Editable data
self.seats = ko.observableArray([
new SeatReservation("Steve", self.availableMeals[0]),
new SeatReservation("Bert", self.availableMeals[0])
]);
// Computed data
self.totalSurcharge = ko.computed(function() {
var total = 0;
for (var i = 0; i < self.seats().length; i++)
total += self.seats()[i].meal().price;
return total;
});
// Operations
self.addSeat = function() {
self.seats.push(new SeatReservation("", self.availableMeals[0]));
}
self.removeSeat = function(seat) { self.seats.remove(seat) }
}
ko.applyBindings(new ReservationsViewModel());
});
移植到这个 Coffee Script
$ ->
SeatReservation = (name, initialMeal) ->
self = this
self.name = name
self.meal = ko.observable(initialMeal)
self.formattedPrice = ko.computed(->
price = self.meal().price
(if price then "$" + price.toFixed(2) else "None")
)
ReservationsViewModel = ->
self = this
self.availableMeals = [
mealName: "Standard (sandwich)"
price: 0
,
mealName: "Premium (lobster)"
price: 34.95
,
mealName: "Ultimate (whole zebra)"
price: 290
]
self.seats = ko.observableArray([ new SeatReservation("Steve", self.availableMeals[0]), new SeatReservation("Bert", self.availableMeals[0]) ])
self.totalSurcharge = ko.computed(->
total = 0
i = 0
while i < self.seats().length
total += self.seats()[i].meal().price
i++
total
)
self.addSeat = ->
self.seats.push new SeatReservation("", self.availableMeals[0])
self.removeSeat = (seat) ->
self.seats.remove seat
ko.applyBindings new ReservationsViewModel()
编译成：
(function() {
$(function() {
var ReservationsViewModel, SeatReservation;
SeatReservation = function(name, initialMeal) {
var self;
self = this;
self.name = name;
self.meal = ko.observable(initialMeal);
return self.formattedPrice = ko.computed(function() {
var price;
price = self.meal().price;
if (price) {
return "$" + price.toFixed(2);
} else {
return "None";
}
});
};
ReservationsViewModel = function() {
var self;
self = this;
return self.availableMeals = [
{
mealName: "Standard (sandwich)",
price: 0
}, {
mealName: "Premium (lobster)",
price: 34.95
}, {
mealName: "Ultimate (whole zebra)",
price: 290
}
];
};
self.seats = ko.observableArray([new SeatReservation("Steve", self.availableMeals[0]), new SeatReservation("Bert", self.availableMeals[0])]);
self.totalSurcharge = ko.computed(function() {
var i, total;
total = 0;
i = 0;
while (i < self.seats().length) {
total += self.seats()[i].meal().price;
i++;
}
return total;
});
self.addSeat = function() {
return self.seats.push(new SeatReservation("", self.availableMeals[0]));
};
return self.removeSeat = function(seat) {
return self.seats.remove(seat);
};
});
ko.applyBindings(new ReservationsViewModel());
}).call(this);
问题是 ReservationsViewModel 在 self.avalaibleMeals 之后立即关闭，而它不应该......
我该如何解决？