javascript - Angularjs 在 ng-repeat 中检查商品库存消息，在右侧商品索引中显示消息

Question

我正在尝试显示库存消息，该商品是否有足够的 quantity在API对象中为用户添加适量的quantity在篮子里。设法用单个项目做到这一点，但由于篮子里的项目是 Array在 ng-repeat 中的正确项目索引上显示库存消息时遇到问题

HTML 模板代码:--

<div ng-repeat="item in vm.basketList">
 ...
 <button ng-click="vm.update(item)">Update qty</button>
 // stock message
 <span ng-if="vm.checkStock == false" class="text-warning">Stock is not enough.</span>
</div>

Controller 更新数量:--

vm.update = function (item) {

 // Will be needing this var for later
  var updateCartItem = {
      ....
      Products: [item]
   }

// Date required for HTTP stock check
   var xd = {
        ...
        ProductIds: [updateCartItem.Products[0].product_idField]
   }
itemService.itemStock(xd)
  .then(function (response) {
     console.log('Checking stock...');

  for (var i = 0; i < response.data.Results.length; i++) {
      var stockElement = response.data.Results[i];
     if (stockElement.qtyField >= updateCartItem.Products[0].qtyField) {
        console.log('Stock is enough go ahead update QTY');
            vm.checkStock = true;
      } else {
        console.log('Stock is not enough');
        vm.checkStock = false;
      }
  }

}

这是我想要实现的图像，我将它们标记为交叉并检查(交叉=没有足够的库存，检查=足够的库存以便更新)。所以留言not enough stock应该只显示在带有十字的项目上。

我的问题是，当我单击按钮更新 qty 时，如何在没有足够库存的商品的正确索引中显示消息？

希望这个问题对某些人来说有意义并且能够回答。

Answer 1

项目具有checkStock属性。

vm.checkStock = false;
// make this
item.checkStock = false

在中继器中

<span ng-if="vm.checkStock == false" class="text-warning">Stock is not enough.</span>

将其更改为

<span ng-if="item.checkStock == false" class="text-warning">Stock is not enough.</span>