If the $routerOnActivate hook returns a promise, the navigation
is commited, once the promise gets fullfilled but the view
is updated immediately.
This commit delays the view update so that both (view and url) are
updated at the same time.
Closes#7777
At the moment ng-link is generating html5mode URLs for `href`s.
Instead it should check whether or not html5mode is enabled and create
the `href`s accordingly. The renaming in the `getLink` function is
aligning it to `RouterLink`'s `_updateLink`.
Closes#7423
The directiveIntrospector was a bit of a hack to allow the router to
read the `$routeConfig` annocation and `$routerCanActivate` hook from
directives when they were registered.
It turns out that if we put these properties on the component controller's
constructor function (i.e. as static class methods) then we can simply
use the `$injector` to access it as required.
Currently, people put the properties directly on their component definition
objects. In Angular 1.5.1, we will copy these properties onto the controller
constructor to maintain a simple migration path. But going forward it may be
better to encourage people to add the properties directly to the controller
constructor.
@petebacondarwin deserves credit for most of this commit.
This allows you to specify a regex and serializer function instead
of the path DSL in your route declaration.
```
@RouteConfig([
{ regex: '[a-z]+.[0-9]+',
serializer: (params) => `{params.a}.params.b}`,
component: MyComponent }
])
class Component {}
```
Closes#7325Closes#7126
The singleton service that represents the top level router was called
`$router` but this is confusing since there are actually lots of routers,
which depend upon where you are in the DOM. This is similar to the situation
with scopes.
This commit clarifies this singleton by renaming it to `$rootRouter`.
BREAKING CHANGE:
The `$router` injectable service has been renamed to `$rootRouter`
The current router is passed to the current component via a binding.
To indicate that this is an angular provided object, this commit
renames the binding to `$router`.
BREAKING CHANGE:
The recently added binding of the current router to the current component
has been renamed from `router` to `$router`.
So now the recommended set up for your bindings in your routed component
is:
```js
{
...
bindings: {
$router: '<'
}
}
```
In Angular 1.5 there is a new helper method for creating component directives.
See https://docs.angularjs.org/guide/component for more information about components.
These kind of directives only match the `E` element form and the previously component
router only created HTML that matched directives that matched the `A` attribute form.
This commit changes the `<ng-outlet>` directive so that it generates custom HTML
elements rather divs with custom attributes to trigger the relevant component to
appear in the DOM.
Going forward, Angular 1.5 users are encouraged to create their router components
using the following style:
```
myModule.componnet('component-name', {
// component definition object
});
```
Closes angular/angular.js#13860
Closes#6076Closes#5278
BREAKING CHANGE:
The component router now creates custom element HTML rather than custom attribute
HTML, in order to create a new component. So rather than
```html
<div custom-component></div>
```
it now creates
```html
<custom-component></custom-component>
```
If you defined you router components using the `directive()` helper and
specified the `restrict` properties such that element matching was not allowed,
e.g. `restrict: 'A'` then these components will no longer be instantiated
by the component router and the outlet will be empty.
The fix is to include `E` in the `restrict` property.
`restrict: 'EA'`
Note that this does not affect directives that did not specify the `restrict`
property as the default for this property is already `EA`.
BREAKING CHANGE:
Previously, components that would implement lifecycle interfaces would include methods
like "onChanges" or "afterViewInit." Given that components were at risk of using such
names without realizing that Angular would call the methods at different points of
the component lifecycle. This change adds an "ng" prefix to all lifecycle hook methods,
far reducing the risk of an accidental name collision.
To fix, just rename these methods:
* onInit
* onDestroy
* doCheck
* onChanges
* afterContentInit
* afterContentChecked
* afterViewInit
* afterViewChecked
* _Router Hooks_
* onActivate
* onReuse
* onDeactivate
* canReuse
* canDeactivate
To:
* ngOnInit,
* ngOnDestroy,
* ngDoCheck,
* ngOnChanges,
* ngAfterContentInit,
* ngAfterContentChecked,
* ngAfterViewInit,
* ngAfterViewChecked
* _Router Hooks_
* routerOnActivate
* routerOnReuse
* routerOnDeactivate
* routerCanReuse
* routerCanDeactivate
The names of lifecycle interfaces and enums have not changed, though interfaces
have been updated to reflect the new method names.
Closes#5036