在Angularjs中，你可以使用orderByFilter（多选列表框）对选定的项目进行排序

Question

我想按“选择”对选择进行排序，然后选择alpha。如果我使用jQuery将选定的项目放在最上面，它看起来很棒，直到用户取消选择其中一个选项。

这里是我创建（没有工作）功能

//User clicked a purpose, move it to the top 
self.purposeLbChanged = function() { 
    //self.PurposePvmsObj = orderByFilter(self.PurposePvmsObj , 'DROP_DOWN_VALUE', false); //sort it alpha first... 
    $("#lbPurpose option:selected").prependTo("#lbPurpose"); 
} 

有没有办法用orderByFilter做到这一点的角？

这里是点击了两个项目 The selected items are at the top 的HTML

<label>Purpose: </label> 
<select name="lbPurpose" id="lbPurpose" ng-model="$ctrl.PurposeSelected" multiple ng-change="$ctrl.purposeLbChanged()"> 
    <option ng-repeat="option in $ctrl.PurposePvmsObj" value="{{option.CD}}">{{option.DROP_DOWN_VALUE}}</option> 
</select> 

。
取消选中某个项目 it doesn't go back to original position

Answer 1

我向对象添加了'position'属性以解决问题。

 //User clicked a purpose, move it to the top 
     self.purposeLbChanged = function() { 

      //Clear the position 
      angular.forEach(self.PurposePvmsObj, function (eachObj){ 
       eachObj.Position = 0; 
      }); 

      //Sort the list by DROP_DOWN_VALUE 
      self.PurposePvmsObj = orderByFilter(self.PurposePvmsObj , 'DROP_DOWN_VALUE', false); 

      //Set the selected values first 
      var i = 1; 
      angular.forEach(self.PurposeSelected, function (eachString){ 
       angular.forEach(self.PurposePvmsObj, function (eachObj){ 
        if(eachObj.CD.trim() == eachString.trim()){ 
         eachObj.Position = 1; //if selected it gets a position of 1. 
        } 
       }) 
      }) 

      //Set the remaining positions 
      angular.forEach(self.PurposePvmsObj, function (eachObj){ 
       if(eachObj.Position == 0){ 
        i++; 
        eachObj.Position = i; 
       } 
      }); 

      //Sort the list by Postion 
      self.PurposePvmsObj = orderByFilter(self.PurposePvmsObj , 'Position', false); 
     }