diff src/app/simple-form/simple-form.component.ts @ 3:b4a1e0a67389

Playing around with material2

--- a/src/app/simple-form/simple-form.component.ts	Tue Oct 25 14:43:01 2016 +0100
+++ b/src/app/simple-form/simple-form.component.ts	Wed Oct 26 11:42:58 2016 +0100
@@ -1,6 +1,6 @@
 import {
   Component, OnInit, Input, Output, EventEmitter,
-  ViewEncapsulation
+  ViewEncapsulation, ViewChild, ElementRef
 } from '@angular/core';
 
 @Component({
@@ -14,30 +14,18 @@
       (mouseup)="isMousedown = false"
       (mouseleave)="isMousedown = false"
     />
+    <pre #testPre>Hi</pre>
+    <pre>{{testHi}}</pre>
     <button (click)="update.emit({text:message})">Click me!</button>
-  `,
-  styles: [`
-:host {
-  display: flex;
-  flex-direction: column;
-}
-
-.mousedown {
-  border: 2px solid green;
-}
-
-input:focus {
-  font-weight: bold;
-  outline: none;
-}
-
-button {
-  border: none;
-}
-`]
+  
+`,
+  styleUrls: ['./simple-form.component.css']
 })
 export class SimpleFormComponent implements OnInit {
 
+  @ViewChild('testPre') testPre: ElementRef;
+  testHi = 'Hi';
+
   isMousedown;
 
   @Input() message;
@@ -49,6 +37,7 @@
   }
 
   ngOnInit() {
+    this.testPre.nativeElement.innerHTML = Math.random().toString();
   }
 
 }