66 lines
1.8 KiB
TypeScript
66 lines
1.8 KiB
TypeScript
|
// #docplaster
|
||
|
|
// #docregion
|
||
|
|
// #docregion imports
|
||
|
|
import {Component, Inject, provide} from 'angular2/core';
|
||
|
|
|
||
|
|
import {CarComponent} from './car/car.component';
|
||
|
|
import {HeroesComponent} from './heroes/heroes.component';
|
||
|
|
|
||
|
|
import {APP_CONFIG,
|
||
|
|
Config, CONFIG} from './app.config';
|
||
|
|
import {Logger} from './logger.service';
|
||
|
|
|
||
|
|
import {User, UserService} from './user.service';
|
||
|
|
// #enddocregion imports
|
||
|
|
import {InjectorComponent} from './injector.component';
|
||
|
|
import {TestComponent} from './test.component';
|
||
|
|
import {ProvidersComponent} from './providers.component';
|
||
|
|
|
||
|
|
@Component({
|
||
|
|
selector: 'my-app',
|
||
|
|
template: `
|
||
|
|
<h1>{{title}}</h1>
|
||
|
|
<my-car></my-car>
|
||
|
|
<my-injectors></my-injectors>
|
||
|
|
<my-tests></my-tests>
|
||
|
|
<h2>User</h2>
|
||
|
|
<p id="user">
|
||
|
|
{{userInfo}}
|
||
|
|
<button (click)='nextUser()'>Next User</button>
|
||
|
|
<p>
|
||
|
|
<my-heroes id="authorized" *ngIf="isAuthorized"></my-heroes>
|
||
|
|
<my-heroes id="unauthorized" *ngIf="!isAuthorized"></my-heroes>
|
||
|
|
`,
|
||
|
|
directives:[CarComponent, HeroesComponent,
|
||
|
|
InjectorComponent, TestComponent, ProvidersComponent],
|
||
|
|
// #docregion providers
|
||
|
|
providers: [
|
||
|
|
Logger,
|
||
|
|
UserService,
|
||
|
|
provide(APP_CONFIG, {useValue: CONFIG})
|
||
|
|
]
|
||
|
|
// #enddocregion providers
|
||
|
|
})
|
||
|
|
export class AppComponent {
|
||
|
|
title:string;
|
||
|
|
|
||
|
|
//#docregion ctor
|
||
|
|
constructor(
|
||
|
|
@Inject(APP_CONFIG) config:Config,
|
||
|
|
private _userService: UserService) {
|
||
|
|
|
||
|
|
this.title = config.title;
|
||
|
|
}
|
||
|
|
// #enddocregion ctor
|
||
|
|
|
||
|
|
get isAuthorized() { return this.user.isAuthorized;}
|
||
|
|
nextUser() { this._userService.getNewUser(); }
|
||
|
|
get user() { return this._userService.user; }
|
||
|
|
|
||
|
|
get userInfo() {
|
||
|
|
return `Current user, ${this.user.name}, is `+
|
||
|
|
`${this.isAuthorized ? '' : 'not'} authorized. `;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
// #enddocregion
|