如何在angularjs中使用ng-switch

Question

我试图使用ng-switch:

显示一些内容

<div ng-app ng-controller="ctrl" >
    <div ng-repeat="list in statusList">
      <p ng-switch on="list">
        <span ng-switch-when="incorrect"> 
        i am incorrect
        </span>
        <span ng-switch-when="stuff">
        i am  stuff
        </span>
        <span ng-switch-when="wrong">
        i am  wrong
        </span>
        <span ng-switch-default>
        Correct
        </span>
      </p>
    </div>
</div>

控制器

function ctrl($scope){
    $scope.statusList=["incorrect","wrong","stuff"];
}

得到如下输出:

i am incorrect

我错了

i am stuff

但是我需要按照我指定的顺序显示输出。例如

我错了
我是东西
我错了

我该怎么做呢，重要的一点是我们不应该改变控制器的顺序

Answer 1

您可以按函数创建自定义订单，如下所示。

<div ng-repeat="list in statusList | orderBy:myValueFunction">

您可以按字母顺序排序(使用过滤器)，但我不建议这样做，因为您可能会添加没有按字母顺序排序的新元素。

Answer 2

ng-repeat迭代使用列表的顺序。您可以定义一个自定义筛选器来对列表进行排序，或者使用另一种方法:

定义一个'contains'过滤器，如果数组包含一个元素，返回true:

.filter('contains', [function() {
    return function(array, element) {
          return array.indexOf(element) > -1;
    }
}])

使用ng-ifs作为模板(不重复):

<div ng-if="statusList | contains : 'incorrect'">i am incorrect</div>
<div ng-if="statusList | contains : 'stuff'">i am stuff</div>
<div ng-if="statusList | contains : 'wrong'">i am wrong</div>

这样你就可以定义任何你想要的顺序。

Plunkr: http://plnkr.co/edit/yaYodJAVCVQ55KbOrf3A?p=preview