Javascript 通过单击ng repeat AngularJS外的按钮移动到下一个和上一个项目

如何通过单击“下一步”按钮转到下一项，如何通过单击“上一步”按钮转到上一项

重复显示数据库中的数据：

IDSelectedShipping是所选的部门或装运id

---

看起来您的目标是在“当前”重复元素上呈现

选定的\u trip

类，而您的“后退/下一步”按钮会改变这一点吗

根据您当前的情况，您需要在

next

和

back

函数中相应地更改

idselectedshipping

的值，但我认为这可能不是最好的解决方法

棘手的部分是，您的底层数据结构，

shippings

，为视图排序。您的控制器和

ngRepeat

块之外的作用域不会意识到这一点。因此，您不能真正有意义地使用

$index

我建议您在控制器中对数组进行预排序，然后跟踪当前索引位置。您的代码可能如下所示：

function MyController ($scope, $filter) {
  $scope.sortedShipments = $filter('orderBy')($scope.shipments, 'predicate', true);
  $scope.currentShipment = 0;

  $scope.back = function () {
    if ($scope.currentShipment > 0) {
     $scope.currentShipment--;
    }
  };

  $scope.next = function () {
    if ($scope.currentShipment < $scope.sortedShipments.length - 1) {
     $scope.currentShipment++;
    }
  };
}

函数MyController（$scope$filter）{
$scope.sortedShipments=$filter（'orderBy'）（$scope.shipments，'predicate'，true）；
$scope.CurrentShipping=0；
$scope.back=函数（）{
如果（$scope.CurrentShipping>0）{
$scope.CurrentShipping--；
}
};
$scope.next=函数（）{
如果（$scope.CurrentShipping<$scope.SortedShippings.length-1）{
$scope.CurrentShipping++；
}
};
}

然后将您的HTML更改为

<div ng-repeat="shipment in sortedShipments">
  <div  ng-click="foo()" ng-class="{selected_trip: $index === currentShipment}">
    <div> From {{shipment.from_location}}</div>
  </div>
</div>

从{{shipping.From_location}

谢谢@cnw的回复，让我试试这个，我会告诉你的。谢谢，伙计，我想它正在工作，但我现在遇到了排序问题，它不工作。这是我以前的排序代码$scope.sortType='shipping_id'$scope.predicate='created_at'；ng repeat=“装运中的装运|订购人：谓词：reverse”$scope.reverse=false$scope.order=函数（谓词）{$scope.reverse=（$scope.predicate===谓词）！$scope.reverse:false；$scope.predicate=谓词；}；它们的值也是$scope.reverse=false；在$scope.predicate='created_at'之后@巨细胞病毒

 $scope.next= function(index){                    
           [index + 1]
       };
 $scope.previous= function(index){                    
           [index - 1]
       };

function MyController ($scope, $filter) {
  $scope.sortedShipments = $filter('orderBy')($scope.shipments, 'predicate', true);
  $scope.currentShipment = 0;

  $scope.back = function () {
    if ($scope.currentShipment > 0) {
     $scope.currentShipment--;
    }
  };

  $scope.next = function () {
    if ($scope.currentShipment < $scope.sortedShipments.length - 1) {
     $scope.currentShipment++;
    }
  };
}

<div ng-repeat="shipment in sortedShipments">
  <div  ng-click="foo()" ng-class="{selected_trip: $index === currentShipment}">
    <div> From {{shipment.from_location}}</div>
  </div>
</div>