AngularJS:javascript中的列表大小未更新

我在AngularJS应用程序中使用SweetAlert作为消息通知。问题是，当我在引导模式中删除表的行（购物车中的产品数量）并单击关闭引导模式时。我想知道屏幕上的行数（购物车中的产品）没有立即更新

当按下行最右侧的垃圾箱按钮时，将显示SweetAlert对话框，然后单击确认删除行


它需要点击其他链接，例如点击“关于我们”链接。

单击后，购物车中的产品编号将更新。

这是在购物车中删除产品时angularjs控制器中的代码片段

    $scope.DeleteCartProduct = function (Row, ROLine, index) {
   //   console.log("DeleteCartProduct .." + index + " ROLine " + ROLine + " Row " + Row);
        swal({
          title: "Are you sure?",
          text: "คุณต้องการลบรายการสินค้า " + ROLine.ProductNameTh + " !",
          type: "warning",
          showCancelButton: true,
          confirmButtonColor: "#DD6B55",
          confirmButtonText: "Yes, delete it!",
          cancelButtonText: "No, cancel please!",
          closeOnConfirm: true,
          closeOnCancel: true
        },
        function(isConfirm){
          if (isConfirm) {
            $('#CartRow'+index).remove();
            $scope.ROHead.ROLineList.splice(index, 1);
            $scope.ROLineList.splice(index, 1);
            if ($scope.ROHead.ROLineList.length <= 0 || $scope.ROHead.ROLineList === undefined) {
              $('#HideCartTable').show('slow');
              $('#ShowCartTable').hide('slow');
            } else if ($scope.ROHead.ROLineList.length > 0) {
              $('#HideCartTable').hide('slow');
              $('#ShowCartTable').show('slow');
            }
            $scope.UpdateCartSummary();
          } else {
          }
        });
    }

$scope.DeleteCartProduct=函数（行、行、索引）{
//console.log（“DeleteCartProduct..”+索引+“ROLine”+ROLine+“行”+行）；
游泳({
标题：“你确定吗？”，
文本：“คุณต้องการลบรายการสินค้า " + ROLine.ProductNameTh+“！”，
键入：“警告”，
showCancelButton:true，
confirmButtonColor:#DD6B55“，
confirmButtonText：“是的，删除它！”，
取消按钮文字：“不，请取消！”，
closeOnConfirm:true，
closeOnCancel：对
},
功能（isConfirm）{
如果（我确认）{
$（'#CartRow'+索引）.remove（）；
$scope.ROHead.ROLineList.splice（索引1）；
$scope.ROLineList.splice（索引1）；
如果（$scope.ROHead.ROLineList.length 0）{
$（“#HideCartTable”）.hide（'slow'）；
$（'ShowCartTable'）。show（'slow'）；
}
$scope.UpdateCartSummary（）；
}否则{
}
});
}

---

任何想法，谢谢

首先，在Controller中混合使用jQuery和AngularJS是个坏主意。你应该用指令包装你的jQuery元素（滑块、下拉列表等）。无论如何，要让这段代码工作，你应该知道如何使用$scope。$apply

当您想在jQuery插件回调中运行angular代码时，必须在包装器$scope.$apply中运行。您的代码应该如下所示：

$scope.DeleteCartProduct = function (Row, ROLine, index) {
//   console.log("DeleteCartProduct .." + index + " ROLine " + ROLine + " Row " + Row);
    swal({
      title: "Are you sure?",
      text: "คุณต้องการลบรายการสินค้า " + ROLine.ProductNameTh + " !",
      type: "warning",
      showCancelButton: true,
      confirmButtonColor: "#DD6B55",
      confirmButtonText: "Yes, delete it!",
      cancelButtonText: "No, cancel please!",
      closeOnConfirm: true,
      closeOnCancel: true
    },
    function(isConfirm){
      $scope.$apply(function(){
        if (isConfirm) {
          $('#CartRow'+index).remove();
          $scope.ROHead.ROLineList.splice(index, 1);
          $scope.ROLineList.splice(index, 1);
          if ($scope.ROHead.ROLineList.length <= 0 || $scope.ROHead.ROLineList === undefined) {
            $('#HideCartTable').show('slow');
            $('#ShowCartTable').hide('slow');
          } else if ($scope.ROHead.ROLineList.length > 0) {
            $('#HideCartTable').hide('slow');
            $('#ShowCartTable').show('slow');
          }
          $scope.UpdateCartSummary();
        } else {

        }
      });
    });
}

$scope.DeleteCartProduct=函数（行、行、索引）{
//console.log（“DeleteCartProduct..”+索引+“ROLine”+ROLine+“行”+行）；
游泳({
标题：“你确定吗？”，
文本：“คุณต้องการลบรายการสินค้า “+ROLine.ProductNameTh+”！“，
键入：“警告”，
showCancelButton:true，
confirmButtonColor:#DD6B55“，
confirmButtonText：“是的，删除它！”，
取消按钮文字：“不，请取消！”，
closeOnConfirm:true，
closeOnCancel：对
},
功能（isConfirm）{
$scope.$apply（函数（）{
如果（我确认）{
$（'#CartRow'+索引）.remove（）；
$scope.ROHead.ROLineList.splice（索引1）；
$scope.ROLineList.splice（索引1）；
如果（$scope.ROHead.ROLineList.length 0）{
$（“#HideCartTable”）.hide（'slow'）；
$（'ShowCartTable'）。show（'slow'）；
}
$scope.UpdateCartSummary（）；
}否则{
}
});
});
}

---

但是不要在$apply函数中运行另一个$apply，它会使脚本崩溃。

您可能需要翻译按钮中的文本。您的问题不是很明显。您不应该像这样将jQuery与Angular混合使用。哇，这就是解决方案：）。不过，我会以更合适的方式调整代码。