如何使用 AngularFire 将对象移动到数组的顶部？答案

【问题标题】：How to move an object to the top of an array with AngularFire?如何使用 AngularFire 将对象移动到数组的顶部？
【发布时间】：2015-06-19 13:15:31
【问题描述】：

我正在尝试使用 AngularFire 将对象移动到数组的顶部。

我在 Firebase 中的数组与此类似：

$scope.todos = [
    {title:"Work out", timetag:"new Date()", done: false },
    {title:"Home work", timetag:"new Date()", done: false }
];

我创建了一个使用 vanilla javascript 将对象存储到变量的函数。该函数从数组中删除要向上移动到数组开头的对象。然后，该函数将您存储到变量中的对象替换为数组的开头。

这是我的代码：

$scope.moveUpPriority = function($index){
    var toMove = $scope.todos[$index];
    delete $scope.todos[$index];
    $scope.todos.splice(0,0, toMove);
    $scope.todos.$save();
  };

这段代码 sn-p 几乎完全按照我想要的方式工作。当我在我的 todo 列表上运行它时，它会将 todo 任务向上移动到数组中。但是，当我刷新页面时，它不会粘住。

有哪些适当的 AngularFire 方法可以将此类 javascript 代码完全保存或设置到我的 Firebase 后端？

【问题讨论】：

您正在渲染的模板是否使用某种 orderBy 表达式？如果是，则 todo-s 所在的顺序无关紧要，因为 Angular 将按特定属性对它们进行排序。
模板使用“高优先级”按钮，当您的鼠标悬停在任务上时，该按钮与 ng-show/ng-hide 一起出现。所以当你用 ng-click 点击“高优先级”按钮时，上面的代码 sn-p 就会执行。

标签： javascript firebase angularfire

【解决方案1】：

要保留 TODO 的顺序，您可以添加一个名为 priority 的属性。

当一个 TODO 被拖动/向上移动优先级列表时，您应该重新设置 TODO 的优先级值保存它们并按模板中的该属性对其进行排序。

【讨论】：

【解决方案2】：

好的，像 splice()、push()、pop()、shift()、unshift() 和 reverse() 这样的数组方法会导致 Firebase 数组中断。

所以我的工作是使用标准 Javascript 数组方法编辑/更改数组。
然后我将本地（已编辑）状态数组的副本存储到一个变量中。
然后我删除 Firebase 阵列。
然后我将本地数组的键推送到 Firebase。

下面是代码：

$scope.moveUpPriority = function($index){
    var toMove = $scope.todos[$index]; //save copy of $index todo

   $scope.todos.splice($index,1); //removes item at $index 
   $scope.todos.splice(0,0, toMove); //adds item toMove to the start of array

   var backup = $scope.todos; //copy back up array


   for(var b = 0; b<= $scope.todos.length; b++){
    $scope.todos.$remove($scope.todos[b]); //remove items from array
   }

   for(var i = 0; i<= backup.length; i++){
    $scope.todos.$add(backup[i]); // add items from back up array
   }
 };

【讨论】：