在Angularjs中,您可以使用orderByFilter(多选列表框)按所选项目排序

时间:2016-11-17 17:43:11

标签: javascript jquery angularjs

我试图通过选择'然后使用alpha on选项对选择进行排序。如果我使用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执行此操作?

这是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>

点击两个项目 The selected items are at the top
取消选择一个项目 it doesn't go back to original position

1 个答案:

答案 0 :(得分:0)

我在对象中添加了“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);
        }