diff --git a/modules/@angular/router/src/directives/router_link.ts b/modules/@angular/router/src/directives/router_link.ts index d24ada3bcf..9eb8f489be 100644 --- a/modules/@angular/router/src/directives/router_link.ts +++ b/modules/@angular/router/src/directives/router_link.ts @@ -16,7 +16,9 @@ import {UrlTree} from '../url_tree'; /** - * The RouterLink directive lets you link to specific parts of your app. + * @whatItDoes Lets you link to specific parts of your app. + * + * @howToUse * * Consider the following route configuration: @@ -24,10 +26,20 @@ import {UrlTree} from '../url_tree'; * [{ path: 'user/:name', component: UserCmp }] * ``` * - * When linking to this `User` route, you can write: + * When linking to this `user/:name` route, you can write: * * ``` - * link to user component + * link to user component + * ``` + * + * @description + * + * The RouterLink directives lets you link to specific parts of your app. + * + * Whe the link is static, you can use the directive as follows: + * + * ``` + * link to user component * ``` * * If you use dynamic values to generate the link, you can pass an array of path @@ -35,6 +47,7 @@ import {UrlTree} from '../url_tree'; * * For instance `['/team', teamId, 'user', userName, {details: true}]` * means that we want to generate a link to `/team/11/user/bob;details=true`. + * * Multiple static segments can be merged into one (e.g., `['/team/11/user', userName, {details: true}]`). * @@ -65,7 +78,12 @@ import {UrlTree} from '../url_tree'; * For instance, if the current url is `/user/(box//aux:team)`. * * Then the following link `Jim` will generate the link - * `/user/(jim//aux:team)`. See {@link Router.createUrlTree} for more information. + * `/user/(jim//aux:team)`. + * + * @selector ':not(a)[routerLink]' + * @ngModule RouterModule + * + * See {@link Router.createUrlTree} for more information. * * @stable */ @@ -111,7 +129,13 @@ export class RouterLink { } /** + * @whatItDoes Lets you link to specific parts of your app. + * * See {@link RouterLink} for more information. + * + * @selector 'a[routerLink]' + * @ngModule RouterModule + * * @stable */ @Directive({selector: 'a[routerLink]'}) diff --git a/modules/@angular/router/src/directives/router_link_active.ts b/modules/@angular/router/src/directives/router_link_active.ts index ff314640c9..3ca2bf69f0 100644 --- a/modules/@angular/router/src/directives/router_link_active.ts +++ b/modules/@angular/router/src/directives/router_link_active.ts @@ -16,6 +16,16 @@ import {RouterLink, RouterLinkWithHref} from './router_link'; /** + * @whatItDoes Lets you add a CSS class to an element when the link's route. + * + * @howToUse + * + * ``` + * Bob + * ``` + * + * @description + * * The RouterLinkActive directive lets you add a CSS class to an element when the link's route * becomes active. * @@ -32,7 +42,7 @@ import {RouterLink, RouterLinkWithHref} from './router_link'; * * ``` * Bob - * Bob + * Bob * ``` * * You can configure RouterLinkActive by passing `exact: true`. This will add the classes @@ -55,6 +65,9 @@ import {RouterLink, RouterLinkWithHref} from './router_link'; * This will set the active-link class on the div tag if the url is either '/user/jim' or * '/user/bob'. * + * @selector ':not(a)[routerLink]' + * @ngModule RouterModule + * * @stable */ @Directive({selector: '[routerLinkActive]'}) diff --git a/modules/@angular/router/src/directives/router_outlet.ts b/modules/@angular/router/src/directives/router_outlet.ts index 8f589c5e88..e8be3b860a 100644 --- a/modules/@angular/router/src/directives/router_outlet.ts +++ b/modules/@angular/router/src/directives/router_outlet.ts @@ -15,25 +15,27 @@ import {PRIMARY_OUTLET} from '../shared'; /** - * A router outlet is a placeholder that Angular dynamically fills based on the application's route. + * @whatItDoes Acts as a placeholder that Angular dynamically fills based on the current router + * state. * - * ## Example + * @howToUse * * ``` * - * - * + * + * * ``` * * A router outlet will emit an activate event any time a new component is being instantiated, * and a deactivate event when it is being destroyed. * - * ## Example - * * ``` - * + * * ``` + * @selector 'a[routerLink]' + * @ngModule RouterModule * * @stable */