So I have 2 directives, lets call them input and auto complete.
The auto complete directive loads a remote template using templateUrl and it includes an input. The auto complete should be able to be placed inside the input directive. Now the issue I am running into is that the input directive is being compiled and executing it's linking function before the auto complete is compiled. This is an issue because the input directive assumes that there is an input element available at the time of running the linking function and since the linking function is running before the auto complete directive is compiled and injects the DOM, the input directive is not finding the input element.
I have to believe that the order of compile, pre, and post linking functions is not maintained with loading templates remotely because of the async nature of it.
Here is a plunker not using any templates:
http://plnkr.co/edit/gEk3GjuASxrV1L6Kp6Dq?p=preview
The compile, pre, and post linking functions are in the order I expect. Then I try the same thing but I have the logCompile2 directive have a template property:
http://plnkr.co/edit/EOYgf5z82mesixcb1LXU?p=preview
Again, the compile, pre, and post linking functions are in the order I expect. Finally we have the logCompile2 directive with a templateUrl properly, loading the template remotely:
http://plnkr.co/edit/A55sw6YRCuhvWUi6zQ4Q?p=preview
Now things are not working as expected, the root parent directive is now going through all the steps before any of the steps are executed for the child directives. The only difference I can see between this version and the other 2 is that the template is loading remotely (and I assume in a async manner).
Is there anyway to make a parent directive wait for all child directives to compile and inject DOM before running the parent's linking function without having to inline the templates?