敲除可拖动的可排序映射克隆改变

时间:2015-01-15 15:28:48

标签: javascript knockout.js knockout-mapping-plugin knockout-sortable

我正在尝试使用knockout-sortable和映射插件将产品列表拖到另一个列表中。

这是一个非常stripped-back fiddle尝试并展示我的目标。

我想要的是'购物车中的产品。在货架上引用而不是克隆产品,

我已经设法通过参考货架上的物品来计算购物车中物品的名称,但是我在购物车中的产品只能获得制作此参考所需的数据时遇到了麻烦,而没有全部其他的。

环顾四周,几年前我发现Ryan Niemeyer对similar problem这个非常诱人的解决方案,但是这些小提琴会出现404错误!

我创造了一个克隆'函数,但因为我的所有数据都已映射,所以它没有使用构造函数,例如:

var product = function(ID, name, other){
    this.productID = ko.observable(ID);
    //etc.
};

这意味着我无法做我想做的事,这是:

product.prototype.clone = function(){
    var x = ko.mapping.toJS(this);
    delete x.productName; 
    delete x.someOtherData;
    ko.mapping.fromJS(x);
};        

我希望通过引用原始productID键将新对象放入购物车。我已经在小提琴中注释了这个代码。拖动后不会调用console.log,因此甚至无法调用该函数。

我还在谷歌论坛上查看了敲门排序并找到了this thread,这是我得到克隆位的地方 - 但我不能使它适合我的用例!

成功回答此问题的结果是,当购物车中只有一辆自行车时,请保持productArray不变,并将listArray设置为[{'productID':1}]

这是我第一次在SO上发布了一个问题,所以如果我没有说清楚的话,请继续关注我!我已经感谢社区了,因为它多年来一直有助于解决我的问题:)

1 个答案:

答案 0 :(得分:0)

您希望映射选项看起来像:

var options = {
    productArray: {
        create: function(mappingData) {
            var result = ko.mapping.fromJS(mappingData.data);

            result.clone = function() {
                return { productID: result.productID() };
            };

            return result;
        }
    }
};

或者,你可以为你的产品创建一个带有克隆功能的构造函数,然后像return new Product(mappingData.data);那样返回

我上面的克隆只是将productID作为不可观察的返回,除非你需要对那个值的变化作出反应,否则应该没问题。

calculatedName函数的第一行必须是:

var x = ko.unwrap(arg.productID);

这将检索值是否可观察,因此该函数可以对productArray或listArray起作用。

http://jsfiddle.net/rniemeyer/hLqctg4L/