(AngularJS) 如何在没有 ng-repeat 的 div 中随机排序 children

Question

我正在制作一个基本的问答应用程序，但我从客户那里收到的 JSON 数据不允许我 ng-repeat 在问答页面上进行选择。我有六个静态元素，它们根据前几页的过滤数据（类别选择等）显示我的选择。如果不随机排列这些元素，获胜的选择总是在同一个地方。

我想在 CSS 中使用 Flexbox 的 "order" 属性来完成此操作。我想生成 1 到 6 之间的随机数，然后将它们分配给每个选择。我在想 ng-style 会是我的朋友，我可以简单地为每个选择调用一个函数，该函数会吐出 1 到 6 之间的随机数并分配 CSS 顺序属性到那个随机数。

我已经能够在每个选择上调用一个函数，但它为每个元素分配相同的 "random" 编号，这没有帮助。我基本上想做类似下面的事情，但它会引发无限摘要循环错误或 "a.replace is not a function" 错误。

如果有人能帮我解决这个问题，我将非常高兴。谢谢！！

AngularJS:

    $scope.randomOrder = function(){
        $scope.randomNum = Math.floor(Math.random() * 6) + 1;
        return{
            "order": $scope.randomNum
        }
    }

HTML:

<div ng-style="randomOrder()"></div>

Answer 1

像往常一样想太多...

我能够使用普通的旧 JS 来完成这项工作。我认为我运行遇到的一个问题是在加载 DOM 中的元素之前调用了随机化函数，所以我对其设置了超时，现在它似乎工作正常。

$scope.randomize = function () {
    var parent = $(".container");
    var divs = parent.children();
    while (divs.length) {
        parent.append(divs.splice(Math.floor(Math.random() * divs.length), 1)[0]);
    }
};
$timeout(function() {
    $scope.randomize();
}, 0);

(AngularJS) 如何在没有 ng-repeat 的 div 中随机排序 children

(AngularJS) How to randomly order children in a div without an ng-repeat

random

flexbox

angularjs

ng-style