javascript - ng-repeat orderBy 位置不起作用

Question

我正在编写一个带有菜单的 Angular 应用程序，我是这样划分的:

HTML:

<ul class="nav navbar-nav" ng-repeat="menuItem in menu |  orderBy:'position'">
    <!-- Home  Mega Menu -->
    <li class="mega-menu">
        <a href="index-corporate.html">{{menuItem.testo}}</a>
    </li>
    <!-- Shortcode Menu Ends -->
    <!-- Header Search -->
    <li class="hidden-767" ng-show="$last">
        <a href="#" class="header-search">
            <span>
                <i class="fa fa-search"></i>
            </span>
        </a>
    </li>
</ul>

JS:

...
$scope.menu = [
    {testo: 'Home', link: 'index.html', position: 1},
    {testo: 'Due', link: 'index.html', position: 2},
    {testo: 'Tre', link: 'index.html', position: 3},
];
...

结果以这种方式渲染:Tre、Due、Home，而不是按位置 Home 渲染， 到期，Tre。

如何解决这个问题？

Answer 1

只需按照documentation中所述使用reverse即可:

 <ul class="nav navbar-nav" ng-repeat="menuItem in menu |  orderBy:'position':reverse">