1。目标
使用 JavaScript、KnockoutJS 或 jQuery 在列表中查找属性。
2。场景
我有一个使用 KnockoutJS 来动态化其 UI 的商店应用程序。
3。问题
我商店的每个可添加到购物车的产品都有一个添加按钮,但仅当该产品尚未添加到购物车中时才可用。
我需要迭代购物车以发现可用产品列表中的每个产品是否已在其中。
4。 一些代码之前...
我要添加到列表的可用产品中的每个产品都使用此片段在按钮之间切换:
<!-- ko if: Summary.hasItem($element) -->
<button class="btn btn-small action remove">
<i class="icon-minus"></i>
</button>
<!-- /ko -->
<!-- ko ifnot: Summary.hasItem($element) -->
<button class="btn btn-small action add">
<i class="icon-plus"></i>
</button>
<!-- /ko -->
如您所见,我正在使用 hasItem()
函数来检查产品是否已在购物车中 - 但我必须实现它,并且需要您的帮助来做到这一点。
5。我已经尝试过的
正如您在下面看到的,我尝试创建一个循环来检查购物车中的产品,直到...
self.hasItem = function (element) {
var $productId = $(element).closest("li").data("productid"),
products = self.products();
if (products.length > 0) {
for (var product in products) {
if (products[product].id() == $productId) {
return true;
} else {
return false;
}
}
}
};
...出了点问题! 下一章继续。
6。出了问题
我的大脑无法计算逻辑,但由于我对每个按钮都有这个循环,似乎当一个按钮运行时,另一个不运行,或者如果列表中有一项,另一个不添加。
7。 Playground
8。我需要问...
我的循环/逻辑是正确的吗?
最佳答案
在你的情况下,这会起作用:
self.hasItem = function (element) {
var $productId = $(element).closest("li").data("productid"),
products = self.products();
return ko.utils.arrayFirst(products, function(p){
return (p.id() == $productId);
}) != null;
}
ko.utils.arrayFirst返回与给定谓词匹配的第一个项目;否则为空。
关于javascript - 使用 JavaScript/KnockoutJS 查找列表中的特定属性,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17491413/