Javascript 如何使用KnockoutJS从外部observableArray删除项目 目标

使用KnockoutJS从外部observableArray删除项目

问题 我的应用程序中有两个

observearray

。一个用于购买可用产品，另一个用于我通过单击

添加按钮添加到摘要中的产品

在这里之前，一切正常。但现在我需要从摘要中删除项目并更改按钮状态/样式-我不知道如何访问外部
observearray

要了解我的问题，请查看或查看下一主题中的标记

如您所见，当我单击添加按钮时，产品进入摘要。当我点击remove（移除）——不管按钮是来自摘要还是来自产品——我想更改按钮状态并从摘要中移除项目。从技术上讲，我想利用
产品的observableArray
从
项目的observableArray
中删除该项目

我的代码
HTML:

你可以

您可以在购物车中查询具有相同id的商品，然后将其删除

self.remove = function (item) {
    var inItems = self.items().filter(function(elem){
        return elem.id() === item.id(); // find the item with the same id
    })[0];
    self.items.remove(inItems);
    item.isAdded(false);
};

除非你有成百上千的物品，否则这应该足够快了。只需记住使用
items.remove（）
，这样它就可以更新
observableArray
：）
一旦您将产品声明为observableArray，您就应该能够对其调用remove（根据）。如果您有一个要传递的被删除对象的引用。
请在您的问题中添加一些可用的代码片段，以防您的JSFIDLE链接将来失效，这个问题变得无法阅读。谢谢您的提示，Neal。我做到了。噢，谢谢你，本杰明。但是，如果我单击摘要项下的“x”？@GuilhermeOderdenge您没有向其添加操作：）您应该使用答案中相同的技术向其添加处理程序。不过，我可能会以一种不同的方式来处理这个设计——有一个产品的可观察阵列和两个计算函数来选择要显示在何处。这样你就不需要显式地管理它了，你只需要设置
isAdded
，它就可以工作了，这在逻辑上是最有意义的。本杰明，你能给我更多关于“两个计算函数选择哪个显示在哪里”的详细信息吗？或者，也许是一个例子？你的观点很好，很高兴听到。@GuilherModerdenge StackOverflow不是一个“免费为我写这段代码”的网站。虽然我喜欢回答有关设计、如何构造代码或如何完成一般工作的问题，比如你最初的问题是关于如何在KnockoutJS的另一个集合中找到项目，但我无意解决不是问题的应用程序错误，也无意编写你的产品代码。这不是这个网站的工作方式，它不会教其他面对同样问题的用户任何东西，从教育学角度来说，这通常是一种不好的方法。@sarcatic，因为OP的代码就是这样做的。他的项目有一个
hisAdded
属性。您的断言是正确的，删除逻辑不需要它。
function Product(id, name, desc) {
    var self = this;

    self.id = ko.observable(id);
    self.name = ko.observable(name);
    self.desc = ko.observable(desc);
    self.isAdded = ko.observable(false);
}

function Item(id, name) {
    var self = this;

    self.id = ko.observable(id);
    self.name = ko.observable(name);
}

function SummaryViewModel() {
    var self = this;
    self.items = ko.observableArray([]);

    self.add = function (item) {
        self.items.push(new Item(item.id(), item.name()));

        console.log(item);

        item.isAdded(true);
    };

    self.remove = function (item) {
        item.isAdded(false);
    };
};

function ProductViewModel(products) {
    var self = this;

    self.products = ko.observableArray(products);
};

var products = [
    new Product(1, "GTA V", "by Rockstar"), 
    new Product(2, "Watch_Dogs", "by Ubisoft")
];

ViewModel = {
    Summary: new SummaryViewModel(),
    Product: new ProductViewModel(products)
}

ko.applyBindings(ViewModel);

self.remove = function (item) {
    var inItems = self.items().filter(function(elem){
        return elem.id() === item.id(); // find the item with the same id
    })[0];
    self.items.remove(inItems);
    item.isAdded(false);
};