Question

我正在尝试实现“取消”按钮功能。单击“应用”按钮后，如果在单击“取消”按钮后对modesList进行任何更改，则必须还原这些更改。例如，最初我检查了Air和InterModal，点击'Apply'后，我也选择了'LTL'。现在我检查了Air，InterModal和LTL。当我点击“取消”时，我预计LTL应该被取消，并且只有Air和InterModal会被检查。但它没有按预期工作。请在http://plnkr.co/edit/2wte2rgMA4RfQbuxItin?p=preview看我的傻瓜。我甚至使用了角度复制，但它仍然无法正常工作。

    $scope.cancel2 = function(){

        angular.copy($scope.modesList, $scope.cancelModesList);
 };

Answer 1

这是您的控制器代码的样子（plunker）：

$scope.modesList = [
  // list
];

$scope.applyFilter = function() {
  $scope.cancelModesList = angular.copy($scope.modesList);
};

$scope.cancel = function() {
  $scope.modesList = angular.copy($scope.cancelModesList);
};

// apply the original copy
$scope.applyFilter();

Answer 2

您的代码现在的方式是取消您的列表，取消列表为空的cancelModeList。你没有任何东西显示是正常的。您只需在cancelModeList中输入一个用作参考的初始列表：

  $scope.cancelModesList = [
  {
    "name": "Air",
    "checked": true,
    "id": "186",
    "type": "group"
  },
  {
    "name": "FTL",
    "checked": false,
    "id": "11114",
    "type": "group"
  },
  {
    "name": "InterModal",
    "checked": true,
    "id": "188",
    "type": "group"
  },
  {
    "name": "LTL",
    "checked": false,
    "id": "185",
    "type": "group"
  }]

然后使用角度副本：

$scope.cancel2 = function(){                
    angular.copy($scope.cancelModesList, $scope.modesList);
};

Angular js取消按钮功能问题

2 个答案: