Skip to content

Commit 1b50e9b

Browse files
docs(guide/component-router): initial draft for component router 0.2.0
Closes angular#14131
1 parent af0574e commit 1b50e9b

10 files changed

+1132
-1
lines changed

docs/content/guide/component-router.ngdoc

+1,008
Large diffs are not rendered by default.

docs/img/guide/component-based-architecture.svg

+4
Loading

docs/img/guide/component-hierarchy.svg

+4
Loading

docs/img/guide/component-routes.svg

+4
Loading

docs/img/guide/crisis-detail.png

32.9 KB
Loading

docs/img/guide/crisis-list.png

38.6 KB
Loading

docs/img/guide/hero-detail.png

27.5 KB
Loading

docs/img/guide/heroes-list.png

29.9 KB
Loading

lib/grunt/utils.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -287,7 +287,7 @@ module.exports = {
287287
rewrite: function(){
288288
return function(req, res, next){
289289
var REWRITE = /\/(guide|api|cookbook|misc|tutorial|error).*$/,
290-
IGNORED = /(\.(css|js|png|jpg|gif)$|partials\/.*\.html$)/,
290+
IGNORED = /(\.(css|js|png|jpg|gif|svg)$|partials\/.*\.html$)/,
291291
match;
292292

293293
if (!IGNORED.test(req.url) && (match = req.url.match(REWRITE))) {

src/ngComponentRouter/Router.js

+111
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,111 @@
1+
/**
2+
* @ngdoc module
3+
* @name ngComponentRouter
4+
* @description
5+
* The new Angular Router
6+
*/
7+
8+
/**
9+
* @ngdoc type
10+
* @name Router
11+
* @description
12+
* A `Router` is responsible for mapping URLs to components.
13+
*
14+
* You can see the state of a router by inspecting the read-only field `router.navigating`.
15+
* This may be useful for showing a spinner, for instance.
16+
*
17+
* ## Concepts
18+
*
19+
* Routers and "Routed Component" instances have a 1:1 correspondence.
20+
*
21+
* The router holds reference to a number of Outlets.
22+
* An outlet is a placeholder that the router dynamically fills in depending on the current URL.
23+
*
24+
* When the router navigates from a URL, it must first recognize it and serialize it into an
25+
* `Instruction`.
26+
* The router uses the `RouteRegistry` to get an `Instruction`.
27+
*/
28+
29+
/**
30+
* @ngdoc type
31+
* @name ChildRouter
32+
* @description
33+
*
34+
*
35+
*/
36+
37+
/**
38+
* @ngdoc type
39+
* @name ComponentInstruction
40+
* @description
41+
* A `ComponentInstruction` represents the route state for a single component. An `Instruction` is
42+
* composed of a tree of these `ComponentInstruction`s.
43+
*
44+
* `ComponentInstructions` is a public API. Instances of `ComponentInstruction` are passed
45+
* to route lifecycle hooks, like `$routerCanActivate`.
46+
*
47+
* You should not modify this object. It should be treated as immutable.
48+
*/
49+
50+
/**
51+
* @ngdoc type
52+
* @name RouteDefinition
53+
* @description
54+
*
55+
*/
56+
57+
/**
58+
* @ngdoc type
59+
* @name RouteParams
60+
* @description
61+
* `RouteParams` is an immutable map of parameters for the given route
62+
* based on the url matcher and optional parameters for that route.
63+
*
64+
*/
65+
66+
/**
67+
* @ngdoc directive
68+
* @name ngOutlet
69+
* @description
70+
*
71+
*/
72+
73+
/**
74+
* @name ngLink
75+
* @description
76+
* Lets you link to different parts of the app, and automatically generates hrefs.
77+
*
78+
* ## Use
79+
* The directive uses a simple syntax: `ng-link="componentName({ param: paramValue })"`
80+
*
81+
* ### Example
82+
*
83+
* ```js
84+
* angular.module('myApp', ['ngComponentRouter'])
85+
* .controller('AppController', ['$rootRouter', function($rootRouter) {
86+
* $rootRouter.config({ path: '/user/:id', component: 'user' });
87+
* this.user = { name: 'Brian', id: 123 };
88+
* });
89+
* ```
90+
*
91+
* ```html
92+
* <div ng-controller="AppController as app">
93+
* <a ng-link="user({id: app.user.id})">{{app.user.name}}</a>
94+
* </div>
95+
* ```
96+
*/
97+
98+
99+
/**
100+
* @ngdoc service
101+
* @name $rootRouter
102+
* @description
103+
*
104+
*/
105+
106+
107+
/**
108+
* @ngdoc service
109+
* @name $routerRootComponent
110+
* @description
111+
*/

0 commit comments

Comments
 (0)