选择菜单

Question

使用Angular我有一个数据集，通过$ http.get调用，过滤然后显示在页面上。此链接将按国家/地区对数据进行排序，是否可以使用选择列表而不是文本链接来复制此数据。

<a ng-click="sort_by('country');">Country</a>

我app.js的一部分

app.controller('customersCrtl', function ($scope, $http, $timeout) {
        $http.get('ajax/getCustomers.php').success(function(data){
        $scope.list = data;
        $scope.currentPage = 1; //current page
        $scope.entryLimit = 20 //max no of items to display in a page
        $scope.filteredItems = $scope.list.length; //Initially for no filter  
        $scope.totalItems = $scope.list.length;
    });
    $scope.filter = function() {
        $timeout(function() { 
            $scope.filteredItems = $scope.filtered.length;
        }, 10);
    };
    $scope.sort_by = function(predicate) {
        $scope.predicate = predicate;
        $scope.reverse = !$scope.reverse;
    };
});

所以我希望根据所选值复制排序...

<select class="form-control">
    <option value="firstname">First name</option>
    <option value="lastname">Last name</option>
    <option value="company">Company name</option>
</select>

Answer 1

首先，您必须将下拉列表绑定到名为sortValue $ scope

的值

<select ng-model="sortValue" class="form-control">
   <option value="firstname">First name</option>
   <option value="lastname">Last name</option>
   <option value="company">Company name</option>
</select>

在控制器中，设置手表以在sortValue更改时更改过滤器：

$scope.$watch('sortValue',function(newValue, oldValue){
    //newValue here is the selected value
    $scope.sort_by(newValue);
});