2015-11-06 17:34:07 -08:00
|
|
|
import {CONST, Type, isPresent} from 'angular2/src/facade/lang';
|
2015-07-13 16:12:48 -07:00
|
|
|
import {RouteDefinition} from './route_definition';
|
|
|
|
export {RouteDefinition} from './route_definition';
|
2015-04-17 09:59:56 -07:00
|
|
|
|
|
|
|
/**
|
2015-09-21 14:43:24 -07:00
|
|
|
* The `RouteConfig` decorator defines routes for a given component.
|
2015-05-01 05:53:38 -07:00
|
|
|
*
|
2015-09-21 14:43:24 -07:00
|
|
|
* It takes an array of {@link RouteDefinition}s.
|
2015-04-17 09:59:56 -07:00
|
|
|
*/
|
2015-05-29 14:58:41 -07:00
|
|
|
@CONST()
|
2015-04-17 09:59:56 -07:00
|
|
|
export class RouteConfig {
|
2015-08-28 11:29:19 -07:00
|
|
|
constructor(public configs: RouteDefinition[]) {}
|
2015-07-13 16:12:48 -07:00
|
|
|
}
|
|
|
|
|
2015-09-21 14:43:24 -07:00
|
|
|
/**
|
|
|
|
* `Route` is a type of {@link RouteDefinition} used to route a path to a component.
|
|
|
|
*
|
|
|
|
* It has the following properties:
|
|
|
|
* - `path` is a string that uses the route matcher DSL.
|
|
|
|
* - `component` a component type.
|
2015-10-25 15:00:27 +05:30
|
|
|
* - `name` is an optional `CamelCase` string representing the name of the route.
|
2015-09-21 14:43:24 -07:00
|
|
|
* - `data` is an optional property of any type representing arbitrary route metadata for the given
|
2015-09-30 14:48:58 +02:00
|
|
|
* route. It is injectable via {@link RouteData}.
|
refactor(router): improve recognition and generation pipeline
This is a big change. @matsko also deserves much of the credit for the implementation.
Previously, `ComponentInstruction`s held all the state for async components.
Now, we introduce several subclasses for `Instruction` to describe each type of navigation.
BREAKING CHANGE:
Redirects now use the Link DSL syntax. Before:
```
@RouteConfig([
{ path: '/foo', redirectTo: '/bar' },
{ path: '/bar', component: BarCmp }
])
```
After:
```
@RouteConfig([
{ path: '/foo', redirectTo: ['Bar'] },
{ path: '/bar', component: BarCmp, name: 'Bar' }
])
```
BREAKING CHANGE:
This also introduces `useAsDefault` in the RouteConfig, which makes cases like lazy-loading
and encapsulating large routes with sub-routes easier.
Previously, you could use `redirectTo` like this to expand a URL like `/tab` to `/tab/posts`:
@RouteConfig([
{ path: '/tab', redirectTo: '/tab/users' }
{ path: '/tab', component: TabsCmp, name: 'Tab' }
])
AppCmp { ... }
Now the recommended way to handle this is case is to use `useAsDefault` like so:
```
@RouteConfig([
{ path: '/tab', component: TabsCmp, name: 'Tab' }
])
AppCmp { ... }
@RouteConfig([
{ path: '/posts', component: PostsCmp, useAsDefault: true, name: 'Posts' },
{ path: '/users', component: UsersCmp, name: 'Users' }
])
TabsCmp { ... }
```
In the above example, you can write just `['/Tab']` and the route `Users` is automatically selected as a child route.
Closes #4728
Closes #4228
Closes #4170
Closes #4490
Closes #4694
Closes #5200
Closes #5475
2015-11-23 18:07:37 -08:00
|
|
|
* - `useAsDefault` is a boolean value. If `true`, the child route will be navigated to if no child
|
|
|
|
* route is specified during the navigation.
|
2015-09-21 14:43:24 -07:00
|
|
|
*
|
2015-10-19 15:37:32 +01:00
|
|
|
* ### Example
|
2015-09-21 14:43:24 -07:00
|
|
|
* ```
|
2016-01-31 20:34:20 -06:00
|
|
|
* import {RouteConfig, Route} from 'angular2/router';
|
2015-09-21 14:43:24 -07:00
|
|
|
*
|
|
|
|
* @RouteConfig([
|
2016-01-31 20:34:20 -06:00
|
|
|
* new Route({path: '/home', component: HomeCmp, name: 'HomeCmp' })
|
2015-09-21 14:43:24 -07:00
|
|
|
* ])
|
|
|
|
* class MyApp {}
|
|
|
|
* ```
|
|
|
|
*/
|
2015-07-13 16:12:48 -07:00
|
|
|
@CONST()
|
|
|
|
export class Route implements RouteDefinition {
|
2015-09-30 14:48:58 +02:00
|
|
|
data: {[key: string]: any};
|
2015-07-13 16:12:48 -07:00
|
|
|
path: string;
|
|
|
|
component: Type;
|
2015-10-25 15:00:27 +05:30
|
|
|
name: string;
|
refactor(router): improve recognition and generation pipeline
This is a big change. @matsko also deserves much of the credit for the implementation.
Previously, `ComponentInstruction`s held all the state for async components.
Now, we introduce several subclasses for `Instruction` to describe each type of navigation.
BREAKING CHANGE:
Redirects now use the Link DSL syntax. Before:
```
@RouteConfig([
{ path: '/foo', redirectTo: '/bar' },
{ path: '/bar', component: BarCmp }
])
```
After:
```
@RouteConfig([
{ path: '/foo', redirectTo: ['Bar'] },
{ path: '/bar', component: BarCmp, name: 'Bar' }
])
```
BREAKING CHANGE:
This also introduces `useAsDefault` in the RouteConfig, which makes cases like lazy-loading
and encapsulating large routes with sub-routes easier.
Previously, you could use `redirectTo` like this to expand a URL like `/tab` to `/tab/posts`:
@RouteConfig([
{ path: '/tab', redirectTo: '/tab/users' }
{ path: '/tab', component: TabsCmp, name: 'Tab' }
])
AppCmp { ... }
Now the recommended way to handle this is case is to use `useAsDefault` like so:
```
@RouteConfig([
{ path: '/tab', component: TabsCmp, name: 'Tab' }
])
AppCmp { ... }
@RouteConfig([
{ path: '/posts', component: PostsCmp, useAsDefault: true, name: 'Posts' },
{ path: '/users', component: UsersCmp, name: 'Users' }
])
TabsCmp { ... }
```
In the above example, you can write just `['/Tab']` and the route `Users` is automatically selected as a child route.
Closes #4728
Closes #4228
Closes #4170
Closes #4490
Closes #4694
Closes #5200
Closes #5475
2015-11-23 18:07:37 -08:00
|
|
|
useAsDefault: boolean;
|
2015-10-30 17:05:30 -07:00
|
|
|
// added next three properties to work around https://github.com/Microsoft/TypeScript/issues/4107
|
|
|
|
aux: string = null;
|
|
|
|
loader: Function = null;
|
refactor(router): improve recognition and generation pipeline
This is a big change. @matsko also deserves much of the credit for the implementation.
Previously, `ComponentInstruction`s held all the state for async components.
Now, we introduce several subclasses for `Instruction` to describe each type of navigation.
BREAKING CHANGE:
Redirects now use the Link DSL syntax. Before:
```
@RouteConfig([
{ path: '/foo', redirectTo: '/bar' },
{ path: '/bar', component: BarCmp }
])
```
After:
```
@RouteConfig([
{ path: '/foo', redirectTo: ['Bar'] },
{ path: '/bar', component: BarCmp, name: 'Bar' }
])
```
BREAKING CHANGE:
This also introduces `useAsDefault` in the RouteConfig, which makes cases like lazy-loading
and encapsulating large routes with sub-routes easier.
Previously, you could use `redirectTo` like this to expand a URL like `/tab` to `/tab/posts`:
@RouteConfig([
{ path: '/tab', redirectTo: '/tab/users' }
{ path: '/tab', component: TabsCmp, name: 'Tab' }
])
AppCmp { ... }
Now the recommended way to handle this is case is to use `useAsDefault` like so:
```
@RouteConfig([
{ path: '/tab', component: TabsCmp, name: 'Tab' }
])
AppCmp { ... }
@RouteConfig([
{ path: '/posts', component: PostsCmp, useAsDefault: true, name: 'Posts' },
{ path: '/users', component: UsersCmp, name: 'Users' }
])
TabsCmp { ... }
```
In the above example, you can write just `['/Tab']` and the route `Users` is automatically selected as a child route.
Closes #4728
Closes #4228
Closes #4170
Closes #4490
Closes #4694
Closes #5200
Closes #5475
2015-11-23 18:07:37 -08:00
|
|
|
redirectTo: any[] = null;
|
|
|
|
constructor({path, component, name, data, useAsDefault}: {
|
|
|
|
path: string,
|
|
|
|
component: Type, name?: string, data?: {[key: string]: any}, useAsDefault?: boolean
|
|
|
|
}) {
|
2015-07-13 16:12:48 -07:00
|
|
|
this.path = path;
|
|
|
|
this.component = component;
|
2015-10-25 15:00:27 +05:30
|
|
|
this.name = name;
|
2015-08-10 20:29:40 -04:00
|
|
|
this.data = data;
|
refactor(router): improve recognition and generation pipeline
This is a big change. @matsko also deserves much of the credit for the implementation.
Previously, `ComponentInstruction`s held all the state for async components.
Now, we introduce several subclasses for `Instruction` to describe each type of navigation.
BREAKING CHANGE:
Redirects now use the Link DSL syntax. Before:
```
@RouteConfig([
{ path: '/foo', redirectTo: '/bar' },
{ path: '/bar', component: BarCmp }
])
```
After:
```
@RouteConfig([
{ path: '/foo', redirectTo: ['Bar'] },
{ path: '/bar', component: BarCmp, name: 'Bar' }
])
```
BREAKING CHANGE:
This also introduces `useAsDefault` in the RouteConfig, which makes cases like lazy-loading
and encapsulating large routes with sub-routes easier.
Previously, you could use `redirectTo` like this to expand a URL like `/tab` to `/tab/posts`:
@RouteConfig([
{ path: '/tab', redirectTo: '/tab/users' }
{ path: '/tab', component: TabsCmp, name: 'Tab' }
])
AppCmp { ... }
Now the recommended way to handle this is case is to use `useAsDefault` like so:
```
@RouteConfig([
{ path: '/tab', component: TabsCmp, name: 'Tab' }
])
AppCmp { ... }
@RouteConfig([
{ path: '/posts', component: PostsCmp, useAsDefault: true, name: 'Posts' },
{ path: '/users', component: UsersCmp, name: 'Users' }
])
TabsCmp { ... }
```
In the above example, you can write just `['/Tab']` and the route `Users` is automatically selected as a child route.
Closes #4728
Closes #4228
Closes #4170
Closes #4490
Closes #4694
Closes #5200
Closes #5475
2015-11-23 18:07:37 -08:00
|
|
|
this.useAsDefault = useAsDefault;
|
2015-07-13 16:12:48 -07:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2015-09-21 14:43:24 -07:00
|
|
|
/**
|
|
|
|
* `AuxRoute` is a type of {@link RouteDefinition} used to define an auxiliary route.
|
|
|
|
*
|
|
|
|
* It takes an object with the following properties:
|
|
|
|
* - `path` is a string that uses the route matcher DSL.
|
|
|
|
* - `component` a component type.
|
2015-10-25 15:00:27 +05:30
|
|
|
* - `name` is an optional `CamelCase` string representing the name of the route.
|
2015-09-21 14:43:24 -07:00
|
|
|
* - `data` is an optional property of any type representing arbitrary route metadata for the given
|
2015-09-30 14:48:58 +02:00
|
|
|
* route. It is injectable via {@link RouteData}.
|
2015-09-21 14:43:24 -07:00
|
|
|
*
|
2015-10-19 15:37:32 +01:00
|
|
|
* ### Example
|
2015-09-21 14:43:24 -07:00
|
|
|
* ```
|
|
|
|
* import {RouteConfig, AuxRoute} from 'angular2/router';
|
|
|
|
*
|
|
|
|
* @RouteConfig([
|
|
|
|
* new AuxRoute({path: '/home', component: HomeCmp})
|
|
|
|
* ])
|
|
|
|
* class MyApp {}
|
|
|
|
* ```
|
|
|
|
*/
|
2015-07-17 13:36:53 -07:00
|
|
|
@CONST()
|
|
|
|
export class AuxRoute implements RouteDefinition {
|
2015-09-30 14:48:58 +02:00
|
|
|
data: {[key: string]: any} = null;
|
2015-07-17 13:36:53 -07:00
|
|
|
path: string;
|
|
|
|
component: Type;
|
2015-10-25 15:00:27 +05:30
|
|
|
name: string;
|
2015-10-30 17:05:30 -07:00
|
|
|
// added next three properties to work around https://github.com/Microsoft/TypeScript/issues/4107
|
|
|
|
aux: string = null;
|
2015-07-17 13:36:53 -07:00
|
|
|
loader: Function = null;
|
refactor(router): improve recognition and generation pipeline
This is a big change. @matsko also deserves much of the credit for the implementation.
Previously, `ComponentInstruction`s held all the state for async components.
Now, we introduce several subclasses for `Instruction` to describe each type of navigation.
BREAKING CHANGE:
Redirects now use the Link DSL syntax. Before:
```
@RouteConfig([
{ path: '/foo', redirectTo: '/bar' },
{ path: '/bar', component: BarCmp }
])
```
After:
```
@RouteConfig([
{ path: '/foo', redirectTo: ['Bar'] },
{ path: '/bar', component: BarCmp, name: 'Bar' }
])
```
BREAKING CHANGE:
This also introduces `useAsDefault` in the RouteConfig, which makes cases like lazy-loading
and encapsulating large routes with sub-routes easier.
Previously, you could use `redirectTo` like this to expand a URL like `/tab` to `/tab/posts`:
@RouteConfig([
{ path: '/tab', redirectTo: '/tab/users' }
{ path: '/tab', component: TabsCmp, name: 'Tab' }
])
AppCmp { ... }
Now the recommended way to handle this is case is to use `useAsDefault` like so:
```
@RouteConfig([
{ path: '/tab', component: TabsCmp, name: 'Tab' }
])
AppCmp { ... }
@RouteConfig([
{ path: '/posts', component: PostsCmp, useAsDefault: true, name: 'Posts' },
{ path: '/users', component: UsersCmp, name: 'Users' }
])
TabsCmp { ... }
```
In the above example, you can write just `['/Tab']` and the route `Users` is automatically selected as a child route.
Closes #4728
Closes #4228
Closes #4170
Closes #4490
Closes #4694
Closes #5200
Closes #5475
2015-11-23 18:07:37 -08:00
|
|
|
redirectTo: any[] = null;
|
|
|
|
useAsDefault: boolean = false;
|
2015-10-25 15:00:27 +05:30
|
|
|
constructor({path, component, name}: {path: string, component: Type, name?: string}) {
|
2015-07-17 13:36:53 -07:00
|
|
|
this.path = path;
|
|
|
|
this.component = component;
|
2015-10-25 15:00:27 +05:30
|
|
|
this.name = name;
|
2015-07-17 13:36:53 -07:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2015-09-21 14:43:24 -07:00
|
|
|
/**
|
|
|
|
* `AsyncRoute` is a type of {@link RouteDefinition} used to route a path to an asynchronously
|
|
|
|
* loaded component.
|
|
|
|
*
|
|
|
|
* It has the following properties:
|
|
|
|
* - `path` is a string that uses the route matcher DSL.
|
|
|
|
* - `loader` is a function that returns a promise that resolves to a component.
|
2015-10-25 15:00:27 +05:30
|
|
|
* - `name` is an optional `CamelCase` string representing the name of the route.
|
2015-09-21 14:43:24 -07:00
|
|
|
* - `data` is an optional property of any type representing arbitrary route metadata for the given
|
2015-09-30 14:48:58 +02:00
|
|
|
* route. It is injectable via {@link RouteData}.
|
refactor(router): improve recognition and generation pipeline
This is a big change. @matsko also deserves much of the credit for the implementation.
Previously, `ComponentInstruction`s held all the state for async components.
Now, we introduce several subclasses for `Instruction` to describe each type of navigation.
BREAKING CHANGE:
Redirects now use the Link DSL syntax. Before:
```
@RouteConfig([
{ path: '/foo', redirectTo: '/bar' },
{ path: '/bar', component: BarCmp }
])
```
After:
```
@RouteConfig([
{ path: '/foo', redirectTo: ['Bar'] },
{ path: '/bar', component: BarCmp, name: 'Bar' }
])
```
BREAKING CHANGE:
This also introduces `useAsDefault` in the RouteConfig, which makes cases like lazy-loading
and encapsulating large routes with sub-routes easier.
Previously, you could use `redirectTo` like this to expand a URL like `/tab` to `/tab/posts`:
@RouteConfig([
{ path: '/tab', redirectTo: '/tab/users' }
{ path: '/tab', component: TabsCmp, name: 'Tab' }
])
AppCmp { ... }
Now the recommended way to handle this is case is to use `useAsDefault` like so:
```
@RouteConfig([
{ path: '/tab', component: TabsCmp, name: 'Tab' }
])
AppCmp { ... }
@RouteConfig([
{ path: '/posts', component: PostsCmp, useAsDefault: true, name: 'Posts' },
{ path: '/users', component: UsersCmp, name: 'Users' }
])
TabsCmp { ... }
```
In the above example, you can write just `['/Tab']` and the route `Users` is automatically selected as a child route.
Closes #4728
Closes #4228
Closes #4170
Closes #4490
Closes #4694
Closes #5200
Closes #5475
2015-11-23 18:07:37 -08:00
|
|
|
* - `useAsDefault` is a boolean value. If `true`, the child route will be navigated to if no child
|
|
|
|
* route is specified during the navigation.
|
2015-09-21 14:43:24 -07:00
|
|
|
*
|
2015-10-19 15:37:32 +01:00
|
|
|
* ### Example
|
2015-09-21 14:43:24 -07:00
|
|
|
* ```
|
2016-01-31 20:34:20 -06:00
|
|
|
* import {RouteConfig, AsyncRoute} from 'angular2/router';
|
2015-09-21 14:43:24 -07:00
|
|
|
*
|
|
|
|
* @RouteConfig([
|
2016-01-31 20:34:20 -06:00
|
|
|
* new AsyncRoute({path: '/home', loader: () => Promise.resolve(MyLoadedCmp), name:
|
|
|
|
* 'MyLoadedCmp'})
|
2015-09-21 14:43:24 -07:00
|
|
|
* ])
|
|
|
|
* class MyApp {}
|
|
|
|
* ```
|
|
|
|
*/
|
2015-07-13 16:12:48 -07:00
|
|
|
@CONST()
|
|
|
|
export class AsyncRoute implements RouteDefinition {
|
2015-09-30 14:48:58 +02:00
|
|
|
data: {[key: string]: any};
|
2015-07-13 16:12:48 -07:00
|
|
|
path: string;
|
|
|
|
loader: Function;
|
2015-10-25 15:00:27 +05:30
|
|
|
name: string;
|
refactor(router): improve recognition and generation pipeline
This is a big change. @matsko also deserves much of the credit for the implementation.
Previously, `ComponentInstruction`s held all the state for async components.
Now, we introduce several subclasses for `Instruction` to describe each type of navigation.
BREAKING CHANGE:
Redirects now use the Link DSL syntax. Before:
```
@RouteConfig([
{ path: '/foo', redirectTo: '/bar' },
{ path: '/bar', component: BarCmp }
])
```
After:
```
@RouteConfig([
{ path: '/foo', redirectTo: ['Bar'] },
{ path: '/bar', component: BarCmp, name: 'Bar' }
])
```
BREAKING CHANGE:
This also introduces `useAsDefault` in the RouteConfig, which makes cases like lazy-loading
and encapsulating large routes with sub-routes easier.
Previously, you could use `redirectTo` like this to expand a URL like `/tab` to `/tab/posts`:
@RouteConfig([
{ path: '/tab', redirectTo: '/tab/users' }
{ path: '/tab', component: TabsCmp, name: 'Tab' }
])
AppCmp { ... }
Now the recommended way to handle this is case is to use `useAsDefault` like so:
```
@RouteConfig([
{ path: '/tab', component: TabsCmp, name: 'Tab' }
])
AppCmp { ... }
@RouteConfig([
{ path: '/posts', component: PostsCmp, useAsDefault: true, name: 'Posts' },
{ path: '/users', component: UsersCmp, name: 'Users' }
])
TabsCmp { ... }
```
In the above example, you can write just `['/Tab']` and the route `Users` is automatically selected as a child route.
Closes #4728
Closes #4228
Closes #4170
Closes #4490
Closes #4694
Closes #5200
Closes #5475
2015-11-23 18:07:37 -08:00
|
|
|
useAsDefault: boolean;
|
2015-10-30 17:05:30 -07:00
|
|
|
aux: string = null;
|
refactor(router): improve recognition and generation pipeline
This is a big change. @matsko also deserves much of the credit for the implementation.
Previously, `ComponentInstruction`s held all the state for async components.
Now, we introduce several subclasses for `Instruction` to describe each type of navigation.
BREAKING CHANGE:
Redirects now use the Link DSL syntax. Before:
```
@RouteConfig([
{ path: '/foo', redirectTo: '/bar' },
{ path: '/bar', component: BarCmp }
])
```
After:
```
@RouteConfig([
{ path: '/foo', redirectTo: ['Bar'] },
{ path: '/bar', component: BarCmp, name: 'Bar' }
])
```
BREAKING CHANGE:
This also introduces `useAsDefault` in the RouteConfig, which makes cases like lazy-loading
and encapsulating large routes with sub-routes easier.
Previously, you could use `redirectTo` like this to expand a URL like `/tab` to `/tab/posts`:
@RouteConfig([
{ path: '/tab', redirectTo: '/tab/users' }
{ path: '/tab', component: TabsCmp, name: 'Tab' }
])
AppCmp { ... }
Now the recommended way to handle this is case is to use `useAsDefault` like so:
```
@RouteConfig([
{ path: '/tab', component: TabsCmp, name: 'Tab' }
])
AppCmp { ... }
@RouteConfig([
{ path: '/posts', component: PostsCmp, useAsDefault: true, name: 'Posts' },
{ path: '/users', component: UsersCmp, name: 'Users' }
])
TabsCmp { ... }
```
In the above example, you can write just `['/Tab']` and the route `Users` is automatically selected as a child route.
Closes #4728
Closes #4228
Closes #4170
Closes #4490
Closes #4694
Closes #5200
Closes #5475
2015-11-23 18:07:37 -08:00
|
|
|
constructor({path, loader, name, data, useAsDefault}: {
|
|
|
|
path: string,
|
|
|
|
loader: Function, name?: string, data?: {[key: string]: any}, useAsDefault?: boolean
|
|
|
|
}) {
|
2015-07-13 16:12:48 -07:00
|
|
|
this.path = path;
|
|
|
|
this.loader = loader;
|
2015-10-25 15:00:27 +05:30
|
|
|
this.name = name;
|
2015-08-10 20:29:40 -04:00
|
|
|
this.data = data;
|
refactor(router): improve recognition and generation pipeline
This is a big change. @matsko also deserves much of the credit for the implementation.
Previously, `ComponentInstruction`s held all the state for async components.
Now, we introduce several subclasses for `Instruction` to describe each type of navigation.
BREAKING CHANGE:
Redirects now use the Link DSL syntax. Before:
```
@RouteConfig([
{ path: '/foo', redirectTo: '/bar' },
{ path: '/bar', component: BarCmp }
])
```
After:
```
@RouteConfig([
{ path: '/foo', redirectTo: ['Bar'] },
{ path: '/bar', component: BarCmp, name: 'Bar' }
])
```
BREAKING CHANGE:
This also introduces `useAsDefault` in the RouteConfig, which makes cases like lazy-loading
and encapsulating large routes with sub-routes easier.
Previously, you could use `redirectTo` like this to expand a URL like `/tab` to `/tab/posts`:
@RouteConfig([
{ path: '/tab', redirectTo: '/tab/users' }
{ path: '/tab', component: TabsCmp, name: 'Tab' }
])
AppCmp { ... }
Now the recommended way to handle this is case is to use `useAsDefault` like so:
```
@RouteConfig([
{ path: '/tab', component: TabsCmp, name: 'Tab' }
])
AppCmp { ... }
@RouteConfig([
{ path: '/posts', component: PostsCmp, useAsDefault: true, name: 'Posts' },
{ path: '/users', component: UsersCmp, name: 'Users' }
])
TabsCmp { ... }
```
In the above example, you can write just `['/Tab']` and the route `Users` is automatically selected as a child route.
Closes #4728
Closes #4228
Closes #4170
Closes #4490
Closes #4694
Closes #5200
Closes #5475
2015-11-23 18:07:37 -08:00
|
|
|
this.useAsDefault = useAsDefault;
|
2015-07-13 16:12:48 -07:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2015-09-21 14:43:24 -07:00
|
|
|
/**
|
refactor(router): improve recognition and generation pipeline
This is a big change. @matsko also deserves much of the credit for the implementation.
Previously, `ComponentInstruction`s held all the state for async components.
Now, we introduce several subclasses for `Instruction` to describe each type of navigation.
BREAKING CHANGE:
Redirects now use the Link DSL syntax. Before:
```
@RouteConfig([
{ path: '/foo', redirectTo: '/bar' },
{ path: '/bar', component: BarCmp }
])
```
After:
```
@RouteConfig([
{ path: '/foo', redirectTo: ['Bar'] },
{ path: '/bar', component: BarCmp, name: 'Bar' }
])
```
BREAKING CHANGE:
This also introduces `useAsDefault` in the RouteConfig, which makes cases like lazy-loading
and encapsulating large routes with sub-routes easier.
Previously, you could use `redirectTo` like this to expand a URL like `/tab` to `/tab/posts`:
@RouteConfig([
{ path: '/tab', redirectTo: '/tab/users' }
{ path: '/tab', component: TabsCmp, name: 'Tab' }
])
AppCmp { ... }
Now the recommended way to handle this is case is to use `useAsDefault` like so:
```
@RouteConfig([
{ path: '/tab', component: TabsCmp, name: 'Tab' }
])
AppCmp { ... }
@RouteConfig([
{ path: '/posts', component: PostsCmp, useAsDefault: true, name: 'Posts' },
{ path: '/users', component: UsersCmp, name: 'Users' }
])
TabsCmp { ... }
```
In the above example, you can write just `['/Tab']` and the route `Users` is automatically selected as a child route.
Closes #4728
Closes #4228
Closes #4170
Closes #4490
Closes #4694
Closes #5200
Closes #5475
2015-11-23 18:07:37 -08:00
|
|
|
* `Redirect` is a type of {@link RouteDefinition} used to route a path to a canonical route.
|
2015-09-21 14:43:24 -07:00
|
|
|
*
|
|
|
|
* It has the following properties:
|
|
|
|
* - `path` is a string that uses the route matcher DSL.
|
refactor(router): improve recognition and generation pipeline
This is a big change. @matsko also deserves much of the credit for the implementation.
Previously, `ComponentInstruction`s held all the state for async components.
Now, we introduce several subclasses for `Instruction` to describe each type of navigation.
BREAKING CHANGE:
Redirects now use the Link DSL syntax. Before:
```
@RouteConfig([
{ path: '/foo', redirectTo: '/bar' },
{ path: '/bar', component: BarCmp }
])
```
After:
```
@RouteConfig([
{ path: '/foo', redirectTo: ['Bar'] },
{ path: '/bar', component: BarCmp, name: 'Bar' }
])
```
BREAKING CHANGE:
This also introduces `useAsDefault` in the RouteConfig, which makes cases like lazy-loading
and encapsulating large routes with sub-routes easier.
Previously, you could use `redirectTo` like this to expand a URL like `/tab` to `/tab/posts`:
@RouteConfig([
{ path: '/tab', redirectTo: '/tab/users' }
{ path: '/tab', component: TabsCmp, name: 'Tab' }
])
AppCmp { ... }
Now the recommended way to handle this is case is to use `useAsDefault` like so:
```
@RouteConfig([
{ path: '/tab', component: TabsCmp, name: 'Tab' }
])
AppCmp { ... }
@RouteConfig([
{ path: '/posts', component: PostsCmp, useAsDefault: true, name: 'Posts' },
{ path: '/users', component: UsersCmp, name: 'Users' }
])
TabsCmp { ... }
```
In the above example, you can write just `['/Tab']` and the route `Users` is automatically selected as a child route.
Closes #4728
Closes #4228
Closes #4170
Closes #4490
Closes #4694
Closes #5200
Closes #5475
2015-11-23 18:07:37 -08:00
|
|
|
* - `redirectTo` is an array representing the link DSL.
|
|
|
|
*
|
|
|
|
* Note that redirects **do not** affect how links are generated. For that, see the `useAsDefault`
|
|
|
|
* option.
|
2015-09-21 14:43:24 -07:00
|
|
|
*
|
2015-10-19 15:37:32 +01:00
|
|
|
* ### Example
|
2015-09-21 14:43:24 -07:00
|
|
|
* ```
|
2016-01-31 20:34:20 -06:00
|
|
|
* import {RouteConfig, Route, Redirect} from 'angular2/router';
|
2015-09-21 14:43:24 -07:00
|
|
|
*
|
|
|
|
* @RouteConfig([
|
2016-01-31 20:34:20 -06:00
|
|
|
* new Redirect({path: '/', redirectTo: ['/Home'] }),
|
|
|
|
* new Route({path: '/home', component: HomeCmp, name: 'Home'})
|
2015-09-21 14:43:24 -07:00
|
|
|
* ])
|
|
|
|
* class MyApp {}
|
|
|
|
* ```
|
|
|
|
*/
|
2015-07-13 16:12:48 -07:00
|
|
|
@CONST()
|
|
|
|
export class Redirect implements RouteDefinition {
|
|
|
|
path: string;
|
refactor(router): improve recognition and generation pipeline
This is a big change. @matsko also deserves much of the credit for the implementation.
Previously, `ComponentInstruction`s held all the state for async components.
Now, we introduce several subclasses for `Instruction` to describe each type of navigation.
BREAKING CHANGE:
Redirects now use the Link DSL syntax. Before:
```
@RouteConfig([
{ path: '/foo', redirectTo: '/bar' },
{ path: '/bar', component: BarCmp }
])
```
After:
```
@RouteConfig([
{ path: '/foo', redirectTo: ['Bar'] },
{ path: '/bar', component: BarCmp, name: 'Bar' }
])
```
BREAKING CHANGE:
This also introduces `useAsDefault` in the RouteConfig, which makes cases like lazy-loading
and encapsulating large routes with sub-routes easier.
Previously, you could use `redirectTo` like this to expand a URL like `/tab` to `/tab/posts`:
@RouteConfig([
{ path: '/tab', redirectTo: '/tab/users' }
{ path: '/tab', component: TabsCmp, name: 'Tab' }
])
AppCmp { ... }
Now the recommended way to handle this is case is to use `useAsDefault` like so:
```
@RouteConfig([
{ path: '/tab', component: TabsCmp, name: 'Tab' }
])
AppCmp { ... }
@RouteConfig([
{ path: '/posts', component: PostsCmp, useAsDefault: true, name: 'Posts' },
{ path: '/users', component: UsersCmp, name: 'Users' }
])
TabsCmp { ... }
```
In the above example, you can write just `['/Tab']` and the route `Users` is automatically selected as a child route.
Closes #4728
Closes #4228
Closes #4170
Closes #4490
Closes #4694
Closes #5200
Closes #5475
2015-11-23 18:07:37 -08:00
|
|
|
redirectTo: any[];
|
2015-10-25 15:00:27 +05:30
|
|
|
name: string = null;
|
2015-10-30 17:05:30 -07:00
|
|
|
// added next three properties to work around https://github.com/Microsoft/TypeScript/issues/4107
|
2015-07-17 13:36:53 -07:00
|
|
|
loader: Function = null;
|
2015-08-10 20:29:40 -04:00
|
|
|
data: any = null;
|
2015-10-30 17:05:30 -07:00
|
|
|
aux: string = null;
|
refactor(router): improve recognition and generation pipeline
This is a big change. @matsko also deserves much of the credit for the implementation.
Previously, `ComponentInstruction`s held all the state for async components.
Now, we introduce several subclasses for `Instruction` to describe each type of navigation.
BREAKING CHANGE:
Redirects now use the Link DSL syntax. Before:
```
@RouteConfig([
{ path: '/foo', redirectTo: '/bar' },
{ path: '/bar', component: BarCmp }
])
```
After:
```
@RouteConfig([
{ path: '/foo', redirectTo: ['Bar'] },
{ path: '/bar', component: BarCmp, name: 'Bar' }
])
```
BREAKING CHANGE:
This also introduces `useAsDefault` in the RouteConfig, which makes cases like lazy-loading
and encapsulating large routes with sub-routes easier.
Previously, you could use `redirectTo` like this to expand a URL like `/tab` to `/tab/posts`:
@RouteConfig([
{ path: '/tab', redirectTo: '/tab/users' }
{ path: '/tab', component: TabsCmp, name: 'Tab' }
])
AppCmp { ... }
Now the recommended way to handle this is case is to use `useAsDefault` like so:
```
@RouteConfig([
{ path: '/tab', component: TabsCmp, name: 'Tab' }
])
AppCmp { ... }
@RouteConfig([
{ path: '/posts', component: PostsCmp, useAsDefault: true, name: 'Posts' },
{ path: '/users', component: UsersCmp, name: 'Users' }
])
TabsCmp { ... }
```
In the above example, you can write just `['/Tab']` and the route `Users` is automatically selected as a child route.
Closes #4728
Closes #4228
Closes #4170
Closes #4490
Closes #4694
Closes #5200
Closes #5475
2015-11-23 18:07:37 -08:00
|
|
|
useAsDefault: boolean = false;
|
|
|
|
constructor({path, redirectTo}: {path: string, redirectTo: any[]}) {
|
2015-07-13 16:12:48 -07:00
|
|
|
this.path = path;
|
|
|
|
this.redirectTo = redirectTo;
|
|
|
|
}
|
2015-04-17 09:59:56 -07:00
|
|
|
}
|