diff options
Diffstat (limited to 'docs/content/guide/dev_guide.services.injecting_controllers.ngdoc')
| -rw-r--r-- | docs/content/guide/dev_guide.services.injecting_controllers.ngdoc | 91 | 
1 files changed, 91 insertions, 0 deletions
| diff --git a/docs/content/guide/dev_guide.services.injecting_controllers.ngdoc b/docs/content/guide/dev_guide.services.injecting_controllers.ngdoc new file mode 100644 index 00000000..75630b32 --- /dev/null +++ b/docs/content/guide/dev_guide.services.injecting_controllers.ngdoc @@ -0,0 +1,91 @@ +@workInProgress +@ngdoc overview +@name Developer Guide: Angular Services: Injecting Services Into Controllers +@description + + +Using services as dependencies for controllers is very similar to using services as dependencies +for another service. + + +Since JavaScript is a dynamic language, DI can't figure out which services to inject by static +types (like in static typed languages). Therefore, you must specify the service name by using the +`$inject` property, which is an array containing strings with names of services to be injected. +The name must match the corresponding service ID registered with angular. The order of the service +IDs matters: the order of the services in the array will be used when calling the factory function +with injected parameters. The names of parameters in factory function don't matter, but by +convention they match the service IDs. + + +<pre> +function myController($loc, $log) { +this.firstMethod = function() { + // use $location service + $loc.setHash(); +}; +this.secondMethod = function() { + // use $log service + $log.info('...'); +}; +} +// which services to inject ? +myController.$inject = ['$location', '$log']; +</pre> + + +<doc:example> +<doc:source> +<script type="text/javascript"> +angular.service('notify', function(win) { +  var msgs = []; +  return function(msg) { +    msgs.push(msg); +    if (msgs.length == 3) { +      win.alert(msgs.join("\n")); +      msgs = []; +    } +  }; +}, {$inject: ['$window']}); + + +function myController(notifyService) { +  this.callNotify = function(msg) { +    notifyService(msg); +  }; +} + + +myController.$inject = ['notify']; +</script> + + +<div ng:controller="myController"> +<p>Let's try this simple notify service, injected into the controller...</p> +<input ng:init="message='test'" type="text" name="message" /> +<button ng:click="callNotify(message);">NOTIFY</button> +</div> +</doc:source> +<doc:scenario> +it('should test service', function(){ +  expect(element(':input[name=message]').val()).toEqual('test'); +}); +</doc:scenario> +</doc:example> + + + + +## Related Topics + + +{@link dev_guide.services.understanding_services Understanding Angular Services} +{@link dev_guide.services.creating_services Creating Angular Services} +{@link dev_guide.services.registering_services Registering Angular Services} +{@link dev_guide.services.managing_dependencies Managing Service Dependencies} +{@link dev_guide.services.testing_services Testing Angular Services} + + +## Related API + + +{@link api/angular.service Angular Service API} | 
