Question

我目前正在使用一个使用数组样式查询参数来过滤项目的API，但我不太确定如何在Angular中使用它。

在下面的示例中，我有一个下拉列表，它接受选择的ng模型并将其应用于参数列表，然后触发一个方法来过滤我的列表。通常，在处理普通键值时这很简单。但是，在这种情况下，URL会调用以下内容：

example.com/api/list?filter[number]=1

我目前的设置如此

$scope.paramers = {
    include: 'playing', 
    sort: '-id'
};
$scope.refresh = function () {
    LFGFactory.query($scope.paramers, function success (response) {
        $scope.loading = true;
        var data = response.data;
        if (data.length >= 1) {
            $scope.rowList = data;
            $scope.loading = false;
        } else {
            $scope.loading = false;
        }
    },
    function err (data) {
        console.log(data);
    });
};

虽然我的观点如此：

        <div class="form-group pull-right">
            <select id="plat-sel" name="plat-sel" class="form-control" ng-model="paramers.filter" ng-change="refresh()">
                <option value="" disabled selected>Filter by Platform</option>
                <option value="1183">Xbox One</option>
                <option value="1184">PlayStation 4</option>
                <option value="1182">PC</option>
                <option value="1188">Wii U</option>
                <option value="1186">Xbox 360</option>
                <option value="1185">PlayStation 3</option>
            </select>
        </div>

以下的工厂

  .factory('LFGFactory', function($resource) {

    var base = 'http://example.com/api/v1.0/';


    return $resource(base +'lfg', {},
        {
          update: {
            method: 'PUT',
            isArray: true
          },
          delete: {
            method: 'DELETE',
            isArray: true
          },
          query: {
            method: 'GET',
            isArray: false
          }
        }
    );
  })

通常情况下，如果我想要的只是在现有的$ scope.paramers对象中添加过滤器：'1'，那就没问题了。但是我需要以某种方式添加filter [number] = 1。我将如何使用ng-model和我目前的设置来解决这个问题？

Answer 1

查看您的LFGFactory服务：

hey

您正在使用angular.module('myApp').factory('LFGFactory', function($resource) { var base = 'example.com/api/v1.0/'; return $resource(base +'lfg', {}, { update: { method: 'PUT', isArray: true }, delete: { method: 'DELETE', isArray: true }, query: { method: 'GET', isArray: false } } ); })

将您的ngParamSerializer元素更改为：

select

JSFiddle

将数组样式查询参数传递给Angularjs中的资源

1 个答案: