// the main application component

import { Component } from '@angular/core';
import { RouteConfig, ROUTER_DIRECTIVES, ROUTER_PROVIDERS } from '@angular/router-deprecated';

import { ArticlesComponent } from './articles.component';
import { ArticleDetailComponent } from './article-detail.component';
import { LoginComponent } from './login.component';
import { ArticlesService } from './articles.service';
import { LoginService } from './login.service';

@Component({
  selector: 'my-app',
  directives: [ROUTER_DIRECTIVES],
  providers: [ArticlesService, LoginService, ROUTER_PROVIDERS],
  template: `
    <h1>{{ title }}</h1>
    <a [routerLink]="['Articles']">Articles</a>
    <a [routerLink]="['Login']">Login</a>
    <router-outlet></router-outlet>
    `,
})
@RouteConfig([
  {
    path: '/articles',
    name: 'Articles',
    component: ArticlesComponent,
    useAsDefault: true,
  },
  {
    path: '/article/:id',
    name: 'Article',
    component: ArticleDetailComponent,
  },
  {
    path: '/login',
    name: 'Login',
    component: LoginComponent,
  },
])
export class AppComponent {
  title = 'Ilmapallo 2';
}

@@ -708,24 +708,153 @@
 %22%3ELogin%3C/a%3E%0A
+    %3Cspan *ngIf=%22loginService.isLoggedIn()%22%3ELogged in!%3C/span%3E%0A    %3Cspan *ngIf=%22!loginService.isLoggedIn()%22%3ENot logged in.%3C/span%3E%0A
     %3Crouter-
@@ -1243,11 +1243,98 @@
 allo 2';
+%0A%0A  constructor(loginService: LoginService) %7B%0A    this.loginService = loginService;%0A  %7D
 %0A%7D%0A

add logged in / not logged in message