0

我是使用 knockoutjs 的新手,在使用 .computed() 时遇到了这个问题

这是我的 HTML 代码:

<table style="float:left;padding-right:250px" cellspacing="3">    
<tr>
    <td>Product Name</td>
    <td>Price</td>
    <td>Stocks</td>
</tr>
<tbody data-bind="foreach: Products">
    <tr>
        <td><a href="#" data-bind="text: Name, click:$root.addProduct, value: Name"></a></td>            
        <td><input  data-bind="value: Price" size="3"/></td>
        <td data-bind="text:Stocks"></td>
    </tr>
</tbody>
</table>

<table style="float:left">    
<tr>
    <td>SKU</td>
    <td>Product Name</td>
    <td>Price</td>
    <td>Qty</td>
    <td>Sub</td>
</tr>
<tbody data-bind="foreach: Cart">
    <tr>            
        <td data-bind="text: SKU"></td> 
        <td data-bind="text: Name"></td>            
        <td data-bind="text: Price"></td>
        <td data-bind="text: Quantity"></td>
        <td data-bind="text: SubTotal()"></td>
        <td><a href="#" data-bind="click: $root.removeProduct">Remove</a></td>
    </tr>
</tbody>

​</p>

这是我的脚本代码:

var Product = function(data) {
var self = this;

self.SKU = ko.observable(data.SKU);
self.Name = ko.observable(data.Name);
self.Price = ko.observable(data.Price);
self.Stocks = ko.observable(data.Stocks);
self.Quantity = ko.observable(data.Quantity);

self.SubTotal = ko.computed(function() {
    return self.Quantity() * self.Price();
});
};


function ProductViewModel() {
var self = this;
var items = [{
    Name: "Crystalys",
    SKU: "00001",
    Price: 500,
    Stocks: 12,
    Quantity: 0},
{
    Name: "Aghanim's Scepter",
    SKU: "00002",
    Price: 4200,
    Stocks: 5,
    Quantity: 0},
{
    Name: "Vladmir's Offering",
    SKU: "00003",
    Price: 500,
    Stocks: 10,
    Quantity: 0},
{
    Name: "Pwer Threads",
    SKU: "00004",
    Price: 1450,
    Stocks: 20,
    Quantity: 0},
{
    Name: "Satanic",
    SKU: "00005",
    Price: 6150,
    Stocks: 5,
    Quantity: 0},
{
    Name: "The Butterfly",
    SKU: "00006",
    Price: 6000,
    Stocks: 4,
    Quantity: 0},
{
    Name: "Divine Rapier",
    SKU: "00007",
    Price: 6200,
    Stocks: 1,
    Quantity: 0},
{
    Name: "Iron Wood Branch",
    SKU: "00008",
    Price: 53,
    Stocks: 100,
    Quantity: 0}];

self.Products = ko.observableArray(items);
self.Cart = ko.observableArray();

// Operations
self.addProduct = function(Product) {
    self.Cart.push({
        Name: Product.Name,
        Price: Product.Price,
        Quantity: 1,
        SKU: Product.SKU
    });
}
self.removeProduct = function(Product) {
    self.Cart.remove(Product)
}

}
ko.applyBindings(new ProductViewModel());​

我真的不知道似乎是什么错误。请帮忙。先感谢您。

4

1 回答 1

4

您在名为“Product”的函数中定义了计算的 observable,因此它可用于该“类”的实例 - 但您从未实际使用它。可观察数组“Products”和“Cart”填充了普通的 javascript 对象,而不是“Product”类型的实例。

var items = [ new Product({
    Name: "Crystalys",
    SKU: "00001",
    Price: 500,
    Stocks: 12,
    Quantity: 0
}), new Product({ ...
于 2012-06-07T05:59:38.277 回答