Adds template to component book

Author: Gregor Woiwode

book-rating/src/app/book/book.component.html

@@ -1,3 +1,7 @@
-<p>
-  book works!
-</p>
+<div class="well">
+      <div class="thumbnail pull-right">
+            <img src="//gravatar.com/avatar/{{ information.rating }}?s=80&default=wavatar" />
+      </div>
+      <h2>{{ information.title }} <small>Stars {{ information.rating }}</small></h2>
+      <p>{{ information.description }}</p>
+</div>

book-rating/src/app/book/book.component.ts

@@ -1,16 +1,15 @@
-import { Component, OnInit } from '@angular/core';
+import { Component, OnInit, Input } from '@angular/core';
+import { Book } from '../shared';
 
 @Component({
   moduleId: module.id,
-  selector: 'app-book',
+  selector: 'br-book',
   templateUrl: 'book.component.html',
   styleUrls: ['book.component.css']
 })
-export class BookComponent implements OnInit {
+export class BookComponent {
+  @Input() information: Book;
 
-  constructor() {}
-
-  ngOnInit() {
+  constructor() {
   }
-
 }

book-rating/src/app/dashboard/dashboard.component.html

@@ -1,4 +1,3 @@
 <h1>Books</h1>
-<div>
-  {{ books }}
-</div>
+
+<br-book [information]="book"></br-book>

book-rating/src/app/dashboard/dashboard.component.ts

@@ -1,19 +1,22 @@
 import { Component, OnInit } from '@angular/core';
+import { BookComponent } from '../book';
+import { Book } from '../shared';
 
 @Component({
   moduleId: module.id,
   selector: 'br-dashboard',
   templateUrl: 'dashboard.component.html',
-  styleUrls: ['dashboard.component.css']
+  styleUrls: ['dashboard.component.css'],
+  directives: [BookComponent]
 })
 export class DashboardComponent implements OnInit {
 
-  books: string[];
+  book: Book;
 
   constructor(){}
 
   ngOnInit() {
-    this.books = ['Angular 2', 'Aurelia'];
+    this.book = new Book('Bericht DWX 2016', 'Das haben wir erlebt');
   }
 
 }