Javascript 通过ng重复跟踪isn'；t跟踪

我试图建立一个单一的名单，将通过点击上下按钮进行更新。还有，我正在和AngularJS一起做这件事

这是我的HTML：

<div ng-repeat="element in playlistElements | orderBy: element.position track by element.position"
     class="track {{ element.type }} track-{{ element.position }}">
    <div class="full-line bold">{{ element.firstLine }}</div>
    <div class="full-line">{{ element.lastLine }}</div>
    <div class="track-controls">
        <p>
            <i class="fa fa-arrow-up" ng-if="!$first" ng-click="rebuildPlaylist(element, 'up')"></i>
            <i class="fa fa-arrow-down" ng-if="!$last" ng-click="rebuildPlaylist(element, 'down')"></i>
            <i class="fa fa-times" ng-click="rebuildPlaylist(element, 'remove')"></i>
        </p>
    </div>
</div>

当我点击向上箭头“picture”时，我的

元素的
位置
值

正在用正确的值更新自身，并且我的

元素

对象在DOM中看起来是干净的

但这似乎不是用新值

position

来“重新加载”DOM

不确定我是否清楚，所以问我准确度。我已经很长时间没有使用Angular了，所以，也许我做错了

---

谢谢你的帮助：）。

我设法用你的代码样本制作了一把工作小提琴。您可以在这里查看：

以及：

$scope.rebuildPlaylist=函数（索引、操作）{
如果（操作=='up'&&index>0）{
var tempoStorage=$scope.playlinements[index]；
$scope.playlinements[index]=$scope.playlinements[index-1]；
$scope.playlegments[index-1]=临时存储空间；
}
if（action='down'&&index<$scope.playliements.length）{
var tempoStorage=$scope.playlinements[index]；
$scope.playliements[index]=$scope.playliements[index+1]；
$scope.playlegments[index+1]=临时存储空间；
}

基本上有两件事：

1） angular中的“track by”不会影响ng repeat中元素的顺序。它为ng repeat提供了什么样的track by来考虑跟踪每个元素。例如，如果在repeat元素中多次使用同一元素，angular将丢失自身并无法显示。添加“跟踪方式”允许您有一个正确的显示，即使是重复的

2） 我所做的基本上是在单击时为方法调用提供$index，并交换数组中的两个元素。由于ng repeat基于数组，因此颠倒数组中的顺序也会使显示交换。顺便说一下，ng repeat中的$index表示当前元素的索引

---

愉快的编码！

我成功地将您的代码样本制作成了一把小提琴。您可以在这里查看：

以及：

$scope.rebuildPlaylist=函数（索引、操作）{
如果（操作=='up'&&index>0）{
var tempoStorage=$scope.playlinements[index]；
$scope.playlinements[index]=$scope.playlinements[index-1]；
$scope.playlegments[index-1]=临时存储空间；
}
if（action='down'&&index<$scope.playliements.length）{
var tempoStorage=$scope.playlinements[index]；
$scope.playliements[index]=$scope.playliements[index+1]；
$scope.playlegments[index+1]=临时存储空间；
}

基本上有两件事：

1） angular中的“track by”不会影响ng repeat中元素的顺序。它为ng repeat提供了什么样的track by来考虑跟踪每个元素。例如，如果在repeat元素中多次使用同一元素，angular将丢失自身并无法显示。添加“跟踪方式”允许您有一个正确的显示，即使是重复的

2） 我所做的基本上是在单击时为方法调用提供$index，并交换数组中的两个元素。由于ng repeat基于数组，因此颠倒数组中的顺序也会使显示交换。顺便说一下，ng repeat中的$index表示当前元素的索引

---

愉快的编码！

正是我所需要的！我在考虑$index属性，它工作得很好。非常感谢您解释我在做什么。

track by

。没问题！很高兴帮助我完成我所需要的工作！我在考虑$index属性，它工作得很好。非常感谢您解释我在做什么。e> 跟踪方式。没问题！很乐意帮助

$scope.rebuildPlaylist = function(track, action) {
    var media = {
        id: track.id,
        position: track.position
    };
    console.log(track.position);
    if (action == 'up') {
        $scope.playlistElements[media.position].position = media.position - 1;
        $scope.playlistElements[media.position - 1].position = media.position;
    }
    console.log($scope.playlistElements);
};

<i class="fa fa-arrow-up" ng-if="!$first" ng-click="rebuildPlaylist($index, 'up')"></i>
    <i class="fa fa-arrow-down" ng-if="!$last" ng-click="rebuildPlaylist($index, 'down')"></i>

$scope.rebuildPlaylist = function(index, action) {
if (action == 'up' && index > 0) {
  var tempoStorage = $scope.playlistElements[index];
  $scope.playlistElements[index] = $scope.playlistElements[index - 1];
  $scope.playlistElements[index - 1] = tempoStorage;
}
if (action == 'down' &&  index < $scope.playlistElements.length) {
  var tempoStorage = $scope.playlistElements[index];
  $scope.playlistElements[index] = $scope.playlistElements[index + 1];
  $scope.playlistElements[index + 1] = tempoStorage;
}