feat($compile): allow required controllers to be bound to the directive controller

petebacondarwin · petebacondarwin · commit b2c0b056d54d · 2016-01-14T11:56:14.000Z
If directives are required through an object hash, rather than a string or array,
the required directives' controllers are bound to the current directive's controller
in much the same way as the properties are bound to using `bindToController`.

The binding is done after the controller has been constructed and all the bindings
are guaranteed to be complete by the time the controller's `$onInit` method
is called.

This change makes it much simpler to access require controllers without the
need for manually wiring them up in link functions. In particular this
enables support for `require` in directives defined using `mod.component()`
diff --git a/src/ng/compile.js b/src/ng/compile.js
@@ -2414,8 +2414,8 @@ function $CompileProvider($provide, $$sanitizeUriProvider) {
           }
 
           if (isObject(controllerDirective.require) && !isArray(controllerDirective.require)) {
-            var controllers = getControllers(name, controllerDirective.require, $element, elementControllers);
-            console.log(controllers);
+            var controllerObj = getControllers(name, controllerDirective.require, $element, elementControllers);
+            extend(controller.instance, controllerObj);
           }
         }
 
diff --git a/test/ng/compileSpec.js b/test/ng/compileSpec.js
@@ -5338,6 +5338,48 @@ describe('$compile', function() {
       });
     });
 
+    it('should bind the required controllers to the directive controller, if provided as an object', function() {
+      var parentController, siblingController;
+
+      function ParentController() { this.name = 'Parent'; }
+      function SiblingController() { this.name = 'Sibling'; }
+      function MeController() { this.name = 'Me'; }
+      MeController.prototype.$onInit = function() {
+        parentController = this.container;
+        siblingController = this.friend;
+      };
+      spyOn(MeController.prototype, '$onInit').andCallThrough();
+
+      angular.module('my', [])
+        .directive('me', function() {
+          return {
+            restrict: 'E',
+            scope: {},
+            require: { container: '^parent', friend: 'sibling' },
+            controller: MeController
+          };
+        })
+        .directive('parent', function() {
+          return {
+            restrict: 'E',
+            scope: {},
+            controller: ParentController
+          };
+        })
+        .directive('sibling', function() {
+          return {
+            controller: SiblingController
+          };
+        });
+
+      module('my');
+      inject(function($compile, $rootScope, meDirective) {
+        element = $compile('<parent><me sibling></me></parent>')($rootScope);
+        expect(MeController.prototype.$onInit).toHaveBeenCalled();
+        expect(parentController).toEqual(jasmine.any(ParentController));
+        expect(siblingController).toEqual(jasmine.any(SiblingController));
+      });
+    });
 
     it('should require controller of an isolate directive from a non-isolate directive on the ' +
         'same element', function() {
@@ -5712,7 +5754,7 @@ describe('$compile', function() {
           return {
             require: { myC1: '^c1', myC2: '^c2' },
             link: function(scope, element, attrs, controllers) {
-              log('dep:' + controllers.myC1.name + '-' + controller.myC2.name);
+              log('dep:' + controllers.myC1.name + '-' + controllers.myC2.name);
             }
           };
         });
@@ -9488,5 +9530,5 @@ describe('$compile', function() {
         }));
       });
     });
-  });
+   });
 });

Original file line number	Diff line number	Diff line change
`@@ -2414,8 +2414,8 @@ function $CompileProvider($provide, $$sanitizeUriProvider) {`
`2414`	`2414`	`}`
`2415`	`2415`
`2416`	`2416`	`if (isObject(controllerDirective.require) && !isArray(controllerDirective.require)) {`
`2417`		`- var controllers = getControllers(name, controllerDirective.require, $element, elementControllers);`
`2418`		`- console.log(controllers);`
	`2417`	`+ var controllerObj = getControllers(name, controllerDirective.require, $element, elementControllers);`
	`2418`	`+ extend(controller.instance, controllerObj);`
`2419`	`2419`	`}`
`2420`	`2420`	`}`
`2421`	`2421`