component templateUrl conflicts with controller

[ArniDzhan]

Thanks for putting this demo out, helped solve many issues. But there is something I've stumbled upon and though maybe you can help resolve.

if you change template to templateUrl in a code below then controller events like $routerOnActivate() stop triggering. https://github.com/petebacondarwin/ng1-component-router-demo/blob/master/app/crisis-center.js

.component('crisisList', {
    template:
      '<ul>\n' +
      '  <li ng-repeat="crisis in $ctrl.crises"\n' +
      '    ng-class="{ selected: $ctrl.isSelected(crisis) }"\n' +
      '    ng-click="$ctrl.onSelect(crisis)">\n' +
      // '    >' +
      // '  <a ng-link="[\'CrisisDetail\', { id: crisis.id }]">\n' +
      '    <span class="badge">{{crisis.id}}</span> {{crisis.name}}\n' +
      // '  </a>' +
      '  </li>\n' +
      '</ul>\n',
    bindings: { router: '=' },
    controller: CrisisListComponent,
    $canActivate: function($nextInstruction, $prevInstruction) {
      console.log('$canActivate', arguments);
    }
  })

[ArniDzhan]

@petebacondarwin any advice on how to solve that?

[petebacondarwin]

Let me look into that!

[petebacondarwin]

The difficulty is that using templateUrl causes the instantiation of the controller that contains the $routerOnActivate is asynchronous... We can't even just use a $timeout since we don't know how long it might take to receive the template request.

[ArniDzhan]

thanks, looks like there is a hack solution that should work since I am using template cache https://github.com/angular/angular/issues/4633

[ArniDzhan]

I am not sure why but using timeout like in this example doesn't seem to do it for me http://plnkr.co/edit/UzaDGOyeh6Qt7a0Wb22j?p=preview

[petebacondarwin]

Probably because the timeout is not long enough for the template to be retrieved?

[ArniDzhan]

Probably because the timeout is not long enough for the template to be retrieved?

tried setting more time but still nothing. Maybe coz angular_1_router.js changed and plnkr has an old version.

[petebacondarwin]

I think I have a final solution. Check out https://github.com/petebacondarwin/ng1-component-router-demo/commit/491061a802c4c2186d01b1a13b861a7cdaf61f41#diff-e0f5efa92aaa6eef271a9196ec90abc1R240

[ArniDzhan]

I think I have a final solution. Check out 491061a#diff-e0f5efa92aaa6eef271a9196ec90abc1R240

great, thanks for that. I can confirm that $routerOnActivate and $routerCanReuse work now.

one thing that would be nice to do is change require to routerRequire so that it works with browserify, otherwise require is trying to get the file. I can create PR with a fix