aboutsummaryrefslogtreecommitdiffstats
path: root/docs/content/guide/dev_guide.services.injecting_controllers.ngdoc
diff options
context:
space:
mode:
Diffstat (limited to 'docs/content/guide/dev_guide.services.injecting_controllers.ngdoc')
-rw-r--r--docs/content/guide/dev_guide.services.injecting_controllers.ngdoc91
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}