angularjs - into - dependency injection angular 1
Creando una lista angularjs genéricaController (1)
El ui-router angular me permite resolver diferentes inyecciones que puedo usar en mis controladores.
Creé un ListController genérico simple, y en el ui-router estoy inyectando un objeto que contiene las funciones CRUD específicas para esa vista particular, junto con la plantilla.
Entonces, por ejemplo, digamos que tengo 2 servicios con la misma sintaxis "crud":
addPerson(person, callback){}
deletePerson(person, callback){}
editPerson(person, callback){}
....
addCar(car, callback){}
deleteCar(car, callback){}
editCar(car, callback){}
....
Creé un objeto de mapeo para mapear las funciones CRUD de estos servicios en mi controlador genérico, que se inyecta a través del ui.router.
GenericController:
controller(''ListCtrl'', [''$scope'', ''itemList'', ''functions'', function ($scope, itemList, functions) {
$scope.itemList = itemList;
$scope.addItem = function(){
functions.add($scope.item, callback);
}
.....
}
enrutador
.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''
})
Por lo tanto, puede usarlo también con los automóviles al solo inyectar un mapeo de función diferente en su definición de estado.
Funciona de maravilla.
Pero ahora me gustaría poder usar mi controlador dentro de un div, y no solo en una vista completa. Ahora aquí está el problema:
Si utilizo la directiva ng-controller, el inyector no sabrá qué ofrecer como ''itemList'' o ''functions'' (que es el objeto de mapeo), pero si lo instancia a través del objeto $ controller, entonces ganó ''inject''. tiene su propio alcance, y obtengo
Unknown provider: $scopeProvider <- $scope
porque no podrá crear su propio alcance hijo ... Creo que podría crear un nuevo alcance a través de $ rootScope. $ new () o algo así, pero se parece demasiado a la piratería, y como soy nuevo a angular, creo que esto podría ser un mal enfoque para algo como esto ...
¿Algun consejo?
Para referencia futura, terminé escribiendo un sistema de controladores genéricos y pequeños controladores especializados que los extienden .
Para el ejemplo anterior, el controlador genérico está subclasificado por "PeopleController" y "CarController". Al comienzo del código del controlador, cada uno de ellos hará algo como:
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;
}
Así que ahora puedo instanciar los controladores por sí mismos incluso en la directiva ng-controller, y usarán el controlador genérico para todos los métodos CRUD.