2014-11-21 4 views
4

Угловой ui-router позволяет мне разрешать различные инъекции, которые я могу использовать в своих контроллерах.Создание универсального углового спискаController

Я создал простой общий ListController, а в ui-router я впрыскиваю объект, который содержит функции CRUD, специфичные для этого конкретного вида, вместе с шаблоном.

Так, например, скажем, у меня есть 2 услуги с тем же синтаксисом, как «мусор»:

addPerson(person, callback){} 
deletePerson(person, callback){} 
editPerson(person, callback){} 
.... 
addCar(car, callback){} 
deleteCar(car, callback){} 
editCar(car, callback){} 
.... 

Я создал объект отображения для отображения CRUD функции этих услуг в мой общий контроллер, который впрыскивается через ui.router.

GenericController:

controller('ListCtrl', ['$scope', 'itemList', 'functions', function ($scope, itemList, functions) { 
    $scope.itemList = itemList; 

    $scope.addItem = function(){ 
     functions.add($scope.item, callback); 
    } 
    ..... 
} 

маршрутизатор:

 .state('app.people', { 
      url: '/people', 
      templateUrl: 'views/people.html', 
      resolve: { 
        functions: ['People', function(People){ 
         return { 
         add: People.createPerson, 
         update: People.updatePerson, 
         delete: People.deletePerson, 
         getItemList: People.getPeopleList 
        } 
        }], 
       itemList: ['$q', 'People', function($q, People){ 
       var deferred = $q.defer(); 
        People.getPeopleList(function(resp, status){ 
         deferred.resolve(resp); 
        }); 
        return deferred.promise; 
       }], 
       }, 
      controller: 'GenericController' 
     }) 

Таким образом, вы можете использовать его с автомобилями тоже, просто вводя различное отображение функции в определении состояния.

Работает как очарование.

Но теперь я хотел бы иметь возможность использовать мой контроллер в div, а не только в полном представлении. Теперь вот в чем проблема:

Если я использую директиву ng-controller, инжектор не будет знать, что предоставлять как «itemList» или «функции» (который является объектом сопоставления), но если я создам его через объект $ контроллера, то он не будет иметь свою собственную сферу, и я получаю

Unknown provider: $scopeProvider <- $scope 

, потому что он не сможет создать свою собственную сферу ребенка .. Я предполагаю, что я мог бы создать новую область через $ rootScope. $ new() или что-то в этом роде, но это слишком похоже на взлом, и поскольку я новичок в угловом, я думаю, что это может быть плохой подход для чего-то вроде этого.

Любые советы?

ответ

3

Для дальнейшего использования я в конечном итоге написал систему общих контроллеров и крошечных специализированных контроллеров that extend them.

Для примера выше общий контроллер подклассифицирован как «PeopleController», так и «CarController». В начале кода контроллера, каждый из них будет делать что-то вроде:

controller('PeopleController', ['$scope', 'peopleService', function ($scope, peopleService) { 
angular.extend(this, $controller('listController', {$scope: $scope, functions:{ 

     add: peopleService.addPerson, 
     remove: peopleService.removePerson, 
     [...] 

    }})); 

    $scope.people = $scope.itemList; 

} 

Так что теперь я могу создать экземпляр контроллеров самостоятельно даже в директиве нг-контроллера, и они будут использовать общий контроллер для все методы CRUD.