javascript - 当我点击按钮时 orderBy 没有更新

Question

希望有人能帮助我解决我的问题。我正在尝试根据特定数据对列表进行排序，当我预先说明需要排序的内容时，效果很好。但是，当我单击按钮时执行此操作时，它不会以任何方式对我的列表进行排序。

希望有人能帮我解决这个问题。

这是我的 app.js 代码:

app.controller("ListController", function ($scope, $interval, $http, myService, OpenDataService) {
    myService.async().then(function (d) {

        OpenDataService.opendata = d;

        $scope.openData = OpenDataService.opendata;
        $scope.order = "";



    });

    $scope.orderOptions = ["gemeente", "locatie"];


    $scope.change = function (value) {
        console.log("change");

        $scope.order = value;
        console.log(value);
    }
    $scope.test = OpenWifiData;


});

这是我使用的 html 代码:

<li ng-click="change('gemeente')"><a>locatie</a></li>
<div id="WifiSpots" ng-controller="ListController" class="col-sm-12 col-md-4 col-md-offset-2">
                <div  ng-repeat="item in openData | filter:searchText | orderBy: order">
                    <ul class="list-group">
                        <li class="list-group-item">
                            <div class="row wifiSpots" >
                                <div class="col-md-2">{{item.locatie}}</div>
                                <div class="col-md-2">{{item.gemeente}}</div>
                                <div clas="col-md-1">{{item.distance}}</div>
                                <div clas="col-md-1">{{item.duration}}</div>
                                <button ng-controller="MapController" ng-click="calculateAndDisplayRoute(item.objectid)" class="btn ">Selecteer</button>
                            </div>
                        </li>
                    </ul>
                </div>
            </div>

Answer 1

ng-repeat 指令中的“顺序”与 Controller 中的范围不同。添加一个包装类，如下所示:

$scope.opts = {order: ""};

然后在您的更改函数中更新:

$scope.opts.order = value;

在 html 中:

orderBy:opts.order