0

Ich habe mein ErgebnisSortieren Array Alphabetically- AngularJS

<div ng-repeat="o in vm.gridOptions.data | filter:filt | oderBy : 'title'"> 
    <span>{{o.title}}</span> 
</div> 

hier zeigt, die zeigt,

<div ng-repeat="o in vm.gridOptions.data"> 
    <span>aaa</span> 
    <span>ggg</span> 
    <span>ccc</span> 
    <span>bbb</span> 
</div> 

ich wählen Dropdown haben. Ich sollte in der Lage mein Ergebnis zu sortieren alphabetally nach i 'Alphabetical' Option wählen

<select ng-model="filt"> 
    <option value="-1">vsf</option> 
    <option>Alphabetical</option> 
    <option>sccc</option>          
</select> 

Anfangs habe ich setzte orderBy: 'Titel'. aber das sollte passieren, nachdem ich Dropdown wählen. Wie erreiche ich das?

+0

'Alphabetical' ist jede Spalte Ihrer Array? –

+0

Nein ... Alphabetisch ist nur eine Option aus dem Dropdown-Menü. – Matarishvan

+0

@Matarishvan hast du meine Antwort überprüft? –

Antwort

2

Sehr einfach ..

Sie wollen alphabetisch sortieren .. bedeutet u 'Alphabetical' passieren Wert als 'title' zu Ihrer Wahl haben. weil basierend auf 'title' das Ergebnis

<select ng-model="filt"> 
    <option value="-1">vsf</option> 
    <option value="title">Alphabetical</option> 
    <option>sccc</option>          
</select> 

Dann in Ihrem div

<div ng-repeat="o in vm.gridOptions.data | orderBy:filt"> 

orderBy: filt wird ausgeführt, nur für Ihre option value='title' sortieren wird. Das ist, wo Sortierung

+0

Warum funktioniert diese https://plnrkr.co/edit/b5x4B3Jes3GKRtaoPL9v?p=preview nicht? –

1

Sie können dies versuchen:

<div ng-repeat="o in vm.gridOptions.data | filter:filt | oderBy : filt?'title':''">

1
<select ng-model="filt"> 
    <option>Alphabetical</option> 
    <option>k</option> 
</select> 
<p ng-if="filte=(filt=='Alphabetical')?'':'o.title' "></p> 
<div ng-repeat="o in vm.gridOptions.data | orderBy: filte"> 
<span>{{o.title}}</span> 

1

Es passiert ist besser, wenn Sie die Filter tun und Sortierung in controller. Sie können die Array.prototype.sort() Funktion ändern, wie pro Ihre Anforderung

-Controller

$scope.data=[{ 
    "title" : "gggg" 
},{ 
    "title" : "cccc" 
},{ 
    "title" : "zzzz" 
},{ 
    "title" : "aaaa" 
}]; 
$scope.sortvalue = "None"; 

$scope.changeSortOrder = function() 
{ 
    if($scope.sortvalue == "Alphabetically") 
    { 
    $scope.data.sort(function(a, b){ 
     if(a.title < b.title) return -1; 
     if(a.title > b.title) return 1; 
     return 0; 
    }); 
    } 
} 

HTML

<div ng-controller="myCtrl"> 
    <div ng-repeat="o in data"> 
     <span>{{o.title}}</span> 
    </div> 
    <div> 
    <select ng-model="sortvalue" ng-change="changeSortOrder()"> 
     <option value="None">Select an option</option> 
     <option value="Alphabetically">Alphabetically</option> 
    </select> 
    </div> 
    </div> 

FULL EXAMPLE

Here ist eine Liste der Beispiele, die Array.prototype.sort() verwendet Arrays zu sortieren

1

Versuchen Sie, diese Art und Weise:

var myApp = angular.module('myApp',[]); 
 

 
myApp.controller('MyCtrl',function($scope) { 
 
    $scope.data = [{ 
 
     "title" : "aaa" 
 
    },{ 
 
     "title" : "ggg" 
 
    },{ 
 
     "title" : "ccc" 
 
    },{ 
 
     "title" : "bbb" 
 
    }]; 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="myApp" ng-controller="MyCtrl"> 
 
    <select ng-model="filt"> 
 
    <option value="-1">vsf</option> 
 
    <option value="title">Alphabetical</option> 
 
    <option>sccc</option>          
 
    </select> 
 
    <div ng-repeat="o in data | orderBy:filt"> 
 
    {{o.title}} 
 
</div>