2013-08-11 2 views
2

На данный момент URL localhost/view/titles будет использовать маршрут, контроллер и сервис ниже, и сервер вернет список всех объектов заголовка. Как расширить службу, чтобы разрешить дополнительные параметры запроса, такие как предел результата и т. Д.?

// main app module with route 
var app = angular.module('app', ['ngResource']). 
    config(function ($routeProvider, $locationProvider) { 
     $routeProvider.when(
      '/view/:obj/:limit', 
      { 
       templateUrl: '/static/templates/titles.html', 
       controller: 'titlesController' 
      } 
     )}) 

// list service 
var listService = app.factory('listService', function ($q, $resource) { 
     return { 
      getList: function (obj) { 
       var deferred = $q.defer(); 

       $resource('/api/view/' + obj).query(
        function (response) { 
         console.log('good') 
         deferred.resolve(response); 
        } 
        , 
        function (response) { 
         console.log('bad ' + response.status) 
         deferred.reject(response); 
        } 
       ) 
       return deferred.promise; 
      } 
     } 
    } 
) 


// controller 
var titlesController = bang.controller('titlesController', function($scope, listService, $routeParams){ 
    $scope.titles = listService.getList($routeParams.obj); 
}) 

ответ

3

Ниже приведен пример кода:

angular.module('phonecatServices', ['ngResource']). 
    factory('Phone', function($resource){ 
    return $resource('phones/:phoneId.json', {}, { 
    query: {method:'GET', params:{phoneId:'phones'}, isArray:true} 
    }); 
}); 
0

Это более широкий ответ на вопрос о том, как передать PARAMS к вашему бэкэнд API с помощью строки запроса с помощью модуля ngResource, так как я не мог находите прямые инструкции в другом месте.

ngResource Setup: Установите пакет ngResource из командной строки с помощью bower или npm bower install angular-resource.

В головной элемент страницы index.html добавить скрипт угловато-ресурс

<script src="lib/angular-resource/angular-resource.min.js"></script> 

JS/app.js: Добавьте зависимости. Я оставляю маршруты, так как я использую ui-router, который является отдельной темой.

angular.module('app', ['app.controllers', 'app.services', 'ngResource']) 

Вид: Шаблоны/list.html

<input type="search" ng-model="filters.title" placeholder="Search"> 
<button ng-click="searchList(filters)">Submit</button> 

<div ng-repeat="item in list"> 
    <p>{{item.title}} - {{item.description}}</p> 
</div> 

Контроллер: JS/controllers.js

.controller('ListCtrl', function($scope, ListService) { 
    $scope.searchList = function(filters){ 
    $scope.filters = { title: '' }; //This will clear the search box. 
    $scope.list = ListService.query({title: filters.title}); 
    } 
}) 

Фабрика: JS/services.js. Предполагается, что вы также будете получать запросы по идентификатору элемента. Если не оговорено /:id, {id: '@id'}

.factory('ListService', function($resource) { 
    return $resource('http://localhost:3000/api/view/:id', { id: '@id' }); 
}) 
Смежные вопросы