1

再注文後にリストから単一のアイテムを削除しようとしていますが、シングルクリックでリストから複数のアイテムを削除するようです。

コード：

var testApp = angular.module('testApp', ["kendo.directives"]);
testApp.controller('testController', ['$scope', function($scope) {
  $scope.mapList = [];
  $scope.addMap = function() {
    $scope.mapList.push({
      'mapNameList': [{
        'mapName': 'Test1'
      }]
    });
  };

  $scope.placeholder = function(element) {
    return element.clone().addClass("placeholder").text("drop here");
  };

  $scope.hint = function(element) {
    return element.clone().addClass("hint"); >>---- i feel issue is because of this part but not sure 
  };

  $scope.removeItem = function(data, index) {
    data.mapNameList.splice(index, 1); // it removes multiple but fires one time .
  };

  $scope.addMap = function() {
    $scope.mapList.push({
      'mapNameList': [{
        'mapName': 'Test1'
      }]
    });
  };

  $scope.addDetail = function(data) {
    data.mapNameList.push({
      'mapName': "Test"
    });
  };

}]);

ここで働くフィドルのサンプル

再現手順: //fiddle リンクを参照

1.) [マップの追加] をクリックします。

2.) [詳細の追加] を 5 回クリックします。

3.)ここで、上下にドラッグ アンド ドロップしてレコードを並べ替えてみます。

4.) 任意の削除ボタン をクリックします。

  • 削除ボタンをクリックすると複数のレコードが削除され、さらに削除すると機能しなくなります。
4

1 に答える 1

0

ディレクティブをざっと見てみると、継承と変数kendo-sortableに問題があるようです。$indexディレクティブをあまり見ていないので、何が起こっているのかを確実に知っているように聞こえたくありませんが、要素をドラッグしても配列内の位置 (インデックス) は変わりませんが、removeItem 関数は次を使用して呼び出されます。$indexどういうわけか間違ったアイテムをターゲットにしています。

いずれにせよ、HTML の 26 行目を次のように変更することで、バグを修正できました。

<li ng-repeat="n in data.mapNameList">

に：

<li ng-repeat="n in data.mapNameList track by $index">

重複があるため、問題の一部である可能性があると思います。ただし、配列はオブジェクトのリストであるため、Angular に追跡する何かを与えない限り、Angular はそれらを比較して追跡することはできません。おもう。そのため、順序が正しくないときにそれらを削除すると、Angular がそれらを追跡する方法が混乱する可能性があります。Angular に追跡するものを与えると、これが解決します。

于 2016-08-04T17:06:29.040 に答える