2013-06-14 38 views
10

AngularJS'deki öğelerin listesini nasıl rastgele sırayla sipariş edersiniz? Dahili orderBy filtresinin çalışacağını düşünüyordum, ancak modele bazı ek veriler eklemeden nasıl emin değilim. Bir şey harika olurdu.AngularJS kullanarak bir koleksiyonun sırasını nasıl rastgele hale getirebilirim?

item in items | orderBy:random 

Sıradaki düşüncem özel bir filtre oluşturmaktı ancak daha iyi bir şey varsa bundan kaçınmayı tercih ederim. ,

$scope.random = function(){ 
    return 0.5 - Math.random(); 
}; 

Bu bazen negatif, bazen pozitif rasgele bir değer döndürür:

+4

'um olmadığından sh0ber'in cevabı hakkında yorum yapılamadı Angular uzmanı değil, ancak filtre her zaman değerlendirilebilir ve öğelerin her zaman karıştırılmasına devam eder. Yüklendiklerinde öğelere "rastgele" özellik eklemek ve bu mülke göre sipariş vermek isteyebilirsiniz. – Dogbert

+0

@Dogbert bunun hakkına sahiptir. AngularJS'nin şu anki sürümlerinde, aşağıdaki [kabul edilen cevap] (http://stackoverflow.com/a/17102267/901048) konsolda 'infdig' hataları üretir, çünkü sıralama aynı sipariş iki kez üretilinceye kadar tekrarlanır. [Bu soru] bölümüne bakın (http://stackoverflow.com/questions/21586369/random-orderby-in-angularjs-1-2-returns-infdig-errors). – Blazemonger

cevap

17

orderBy böylece yukarıdaki HTML kullanabilirsiniz sadece array.sort gibi bir işlev parametresini alır ve benzeri kapsamına bir işlevi random tanımlayabilir Bazen 0, dizi rasgele sıralama olacak. Hızlı bir keman sh0ber yöntemi yapmak

+0

Ancak, değer tutarlı olmayacaktır (bazen aynı sırayla "a SJuan76

+0

Orijinal yorumuma hazırla. Her bir karşılaştırma rasgele ise, bir c' ile bitebilirsiniz ve sıralama algoritmasının bunu işleyebildiğinden emin olmalısınız (aslında," siparişin "tanımıyla eşleşmeyecektir). Dogbert'in yorumu, siparişin rastgele ve bir çalışma boyunca tutarlı olduğu rasgele sıralama için bir yöntemi özetlemektedir. – SJuan76

+0

Sevindim, senin için çalıştım. Bunu çağırmak için parens kullanmanıza gerek yok, aşağıdaki @owenmead fiddle kontrol edin. – sh0ber

6

iyi iş gibi görünüyor: http://jsfiddle.net/owenmead/fa4v8/1/

<div ng-controller="MyCtrl"> 
    <p ng-repeat="i in list|orderBy:random">{{i}}</p> 
</div> 

function MyCtrl($scope) { 
    $scope.list = ['a', 'b', 'c', 'd', 'e', 'f', 'g']; 
    $scope.random = function() { 
    return 0.5 - Math.random(); 
    } 
} 

açısal orderBy listesinin bir kopyası üzerinde JavaScript'in sıralama() kullanır. Başka bir cevaba bakarak, belirli tarayıcılar kendi türlerinde kararlıdır, diğerleri değildir. Belki de sadece birkaç tarayıcıda kemanı test edin ve gitmek için iyi olmalısınız: Array.sort Sorting Stability in Different Browsers

PS. 50

+9

FYI - 'Hata: [Hata: [$ rootScope: infdig] ' –

+1

için Hata: [$ rootScope: infdig] 'bu, digest döngüsünün rastgele işlevi iki kez yürüttüğü ve sonuçların tutarsız olduğu için (böylece sonsuz bir sindirim döngüsü veya" infdig "oluşturarak) tutarsız olduğu sonraki açısal sürümlerinde olur. –

+1

@ DavidAnderton'un noktasında bir not (çok yardımcı oldu). Hatayı attıran randomize edilmiş iki sayı alanım olduğunu fark ettim. Model.id'e bir parça ekledim ve şimdi harika çalışıyor. – cchapman

İlgili konular