Question

我正在构建我的第一个应用程序。这是一个订购系统，客户可以在购物车中添加商品。一切都运作良好。但是，我的客户想要一种方法来提醒客户，如果他们试图向购物车添加一个大于当前库存的数量。

我的客户不希望显示库存水平，除非客户添加的东西大于可用库存。

我有一张包含每行库存商品的表格。我想做三件事，如果库存水平高于可用库存，我想改变： •表格行上的类 •将类禁用添加到提交 •显示具有可用库存的div。

为了使问题更有趣，客户必须按包装而不是单独订购。

基本上，我正在尝试使用以下代码：

这是一般标记：

<tr ng-repeat="series_detail in productDetail | filter:filter">
   <td>{{series_detail.sku}}</td>
   <td>{{series_detail.size}}</td>
   <td>{{series_detail.price</td>
   <td>{{series_detail.pack}}</td>
   <td ng-model="totalitems" ng-init="0">{{qty * series_detail.pack | number}}</td>
   <td><span class="itemtotal">{{series_detail.price * qty | number:2}}</span></td>                           

   <td class="form-inline" style="text-align:right;">
       <input type="submit" class="add_to_cart_submit btn btn-danger btn-small" value="Add">
   </td>
</tr>

我想展示这个div

<div ng-show="'{{totalitems}}' > '{{series_detail.stock}}'">Yo, no stock dude</div>

我尝试将一个模型“totalitems”添加到一行，然后使用ngShow弹出它。然而，似乎'totalitems'正在评估一无所获。我已经尝试了其他一些选项，但没有任何效果（ngIF等）。

关于班级的改变，我猜，一旦我对它进行了排序，我可以将表达式转移到ngClass？我玩过这个，再一次，迄今为止没有任何工作。

Answer 1

如果此行进入ng-repeat：

<div ng-show="qty * series_detail.pack > series_detail.stock">Yo, no stock dude</div>

对于类指示，让我们说tr，你可以使用相同的表达式：

<tr ng-class="{outOfStock: (qty * series_detail.pack > series_detail.stock)}" ng-repeat="series_detail in productDetail | filter:filter">

outOfStock是CSS中的类。

BTW，

<td ng-model="totalitems" ng-init="0">{{qty * series_detail.pack | number}}</td>

未将totalitems设置为{{qty * series_detail.pack | number}}评估为的任何内容。

如果您的模型中确实需要totalItems，可能的选择是在series_detail实例上设置方法

objRef.totalItems = function(qty) {
    return qty * this.pack;
}

并将其用作：

<div ng-show="series_detail.totalItems(qty) > series_detail.stock">Yo, no stock dude</div>

<td>{{series_detail.totalItems(qty) | number}}</td>

Answer 2

我不确定能理解一切，但这样的事情应该有效吗？

<div ng-show="isStockAddedGreaterThanAvailable()">{{series_detail.stock}} Yo, no stock dude </div>

在您的控制器中

 $scope.isStockAddedGreaterThanAvailable = function(){
   ....
}

AngularJS：显示X＆gt; Y并添加课程

2 个答案: