Übergeben von Array-Stil-Abfrage-Parameter an eine Ressource in Angularjs

Question

Ich arbeite derzeit mit einer API, die Array-Stil-Abfrage-Parameter verwendet, um Elemente zu filtern, aber ich bin nicht ganz sicher, wie dies in Angular funktioniert.

In meinem Beispiel unten habe ich eine Dropdown-Liste, die das ng-Modell der Auswahl nimmt und diese auf die Liste der Parameter anwendet und dann eine Methode auslöst, um meine Liste zu filtern. Normalerweise ist das bei normalen Schlüsselwerten einfach. Doch in diesem Fall ruft die URL für so etwas wie das folgende:

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

Mein aktuelles Set up sieht aus wie so

$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); 
    }); 
}; 

Während meine Sicht sieht so aus:

 <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> 

Fabrik unten

.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 
      } 
     } 
    ); 
    }) 

Normalerweise wäre das in Ordnung, wenn ich nur dem vorhandenen $ scope.paramers-Objekt filter: '1' hinzufügen wollte. Allerdings muss ich irgendwie Filter [Nummer] = 1 hinzufügen. Wie würde ich das mit ng-model und meinem jetzigen Setup machen?

Answer 1

Ein Blick auf Ihre LFGFactory Service:

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 } } 
    ); 

}) 

Du ngParamSerializer

mit

zu Ihrem select Element ändern:

<select id="plat-sel" name="plat-sel" class="form-control" 
      ng-model="paramers['filter[number]']" ng-change="refresh()"> 

The JSFiddle