From c138c895b9eb181e5e9da46a89b74330acbe4074 Mon Sep 17 00:00:00 2001
From: ambujkhanna <ambuj.webmasters@gmail.com>
Date: Thu, 13 Jul 2017 09:06:58 +0530
Subject: [PATCH 1/2] event binding practice

---
 src/app/app.component.ts           |  6 ++++++
 src/app/app.module.ts              |  3 ++-
 src/app/inner/inner.component.html |  3 +++
 src/app/inner/inner.component.ts   | 15 +++++++++++++++
 4 files changed, 26 insertions(+), 1 deletion(-)
 create mode 100644 src/app/inner/inner.component.html
 create mode 100644 src/app/inner/inner.component.ts

diff --git a/src/app/app.component.ts b/src/app/app.component.ts
index 6792967..57663ae 100644
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -8,5 +8,11 @@ import { Component } from '@angular/core';
 export class AppComponent {
   title = 'app works!';
 
+toggle (){
+//this.show = !this.show;
+alert('sss');
+}
+
+}
 
 
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 67ae491..015eb8a 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -4,10 +4,11 @@ import { FormsModule } from '@angular/forms';
 import { HttpModule } from '@angular/http';
 
 import { AppComponent } from './app.component';
+import { innerComponent } from './inner/inner.component';
 
 @NgModule({
   declarations: [
-    AppComponent
+    AppComponent,innerComponent
   ],
   imports: [
     BrowserModule,
diff --git a/src/app/inner/inner.component.html b/src/app/inner/inner.component.html
new file mode 100644
index 0000000..4763881
--- /dev/null
+++ b/src/app/inner/inner.component.html
@@ -0,0 +1,3 @@
+<p [title]="titleText">
+{{title}}
+</p>
\ No newline at end of file
diff --git a/src/app/inner/inner.component.ts b/src/app/inner/inner.component.ts
new file mode 100644
index 0000000..1b05d83
--- /dev/null
+++ b/src/app/inner/inner.component.ts
@@ -0,0 +1,15 @@
+
+import {Component} from '@angular/core';
+
+@Component({
+    selector : 'app-inner',
+    templateUrl : './inner.component.html'
+})
+
+export class innerComponent{
+    title = "innerComponent text";
+    titleText = "This is custom Text";
+
+
+
+}
\ No newline at end of file

From 8c7fa3fb29aa7fc6a873618a9fd7b143773e08bf Mon Sep 17 00:00:00 2001
From: ambujkhanna <ambuj.webmasters@gmail.com>
Date: Mon, 24 Jul 2017 10:05:48 +0530
Subject: [PATCH 2/2] home changes

---
 .vscode/settings.json              |  3 +++
 src/app/app.component.spec.ts      | 34 ------------------------------
 src/app/inner/inner.component.html | 22 ++++++++++++++++++-
 src/app/inner/inner.component.ts   | 29 +++++++++++++++++++++++++
 4 files changed, 53 insertions(+), 35 deletions(-)
 create mode 100644 .vscode/settings.json
 delete mode 100644 src/app/app.component.spec.ts

diff --git a/.vscode/settings.json b/.vscode/settings.json
new file mode 100644
index 0000000..20af2f6
--- /dev/null
+++ b/.vscode/settings.json
@@ -0,0 +1,3 @@
+// Place your settings in this file to overwrite default and user settings.
+{
+}
\ No newline at end of file
diff --git a/src/app/app.component.spec.ts b/src/app/app.component.spec.ts
deleted file mode 100644
index 5be2cb3..0000000
--- a/src/app/app.component.spec.ts
+++ /dev/null
@@ -1,34 +0,0 @@
-/* tslint:disable:no-unused-variable */
-
-import { TestBed, async } from '@angular/core/testing';
-import { AppComponent } from './app.component';
-
-describe('AppComponent', () => {
-  beforeEach(() => {
-    TestBed.configureTestingModule({
-      declarations: [
-        AppComponent
-      ],
-    });
-    TestBed.compileComponents();
-  });
-
-  it('should create the app', async(() => {
-    const fixture = TestBed.createComponent(AppComponent);
-    const app = fixture.debugElement.componentInstance;
-    expect(app).toBeTruthy();
-  }));
-
-  it(`should have as title 'app works!'`, async(() => {
-    const fixture = TestBed.createComponent(AppComponent);
-    const app = fixture.debugElement.componentInstance;
-    expect(app.title).toEqual('app works!');
-  }));
-
-  it('should render title in a h1 tag', async(() => {
-    const fixture = TestBed.createComponent(AppComponent);
-    fixture.detectChanges();
-    const compiled = fixture.debugElement.nativeElement;
-    expect(compiled.querySelector('h1').textContent).toContain('app works!');
-  }));
-});
diff --git a/src/app/inner/inner.component.html b/src/app/inner/inner.component.html
index 4763881..39e55bc 100644
--- a/src/app/inner/inner.component.html
+++ b/src/app/inner/inner.component.html
@@ -1,3 +1,23 @@
 <p [title]="titleText">
 {{title}}
-</p>
\ No newline at end of file
+</p>
+
+<!-- <input type="text" (input)="clickMe($event)" /> -->
+<hr/>
+<h2>event binding and ngModel </h2>
+<button [disabled]="!allowclick" (click)="onClicked()"> Click Me</button>
+<input type="text" [(ngModel)]="EnteredData" placeholder="Typing..."/>
+<p>{{ShowData}}</p>
+
+<hr/>
+<h2>NgStyle</h2>
+<p [ngStyle]="{backgroundColor:getColor()}">The status is {{currentStatus}} -- {{getColor()}}</p>
+
+<hr/>
+<h2>*ngFor</h2>
+<button (click)="addItems()"> Click Me</button>
+<input type="text" [(ngModel)]="itemName" placeholder="Typing..."/>
+<div *ngFor="let eachItem of repeatItems">
+{{itemName}}
+{{eachItem}}
+</div>
\ No newline at end of file
diff --git a/src/app/inner/inner.component.ts b/src/app/inner/inner.component.ts
index 1b05d83..6d59d56 100644
--- a/src/app/inner/inner.component.ts
+++ b/src/app/inner/inner.component.ts
@@ -10,6 +10,35 @@ export class innerComponent{
     title = "innerComponent text";
     titleText = "This is custom Text";
 
+    allowclick = false;
+    currentStatus;
+    
+    repeatItems = ['item 1','item2', 'item 3'];
 
 
+    constructor(){
+      setTimeout(() => {
+        this.allowclick = true;
+      },2000);
+  
+      this.currentStatus = Math.random() > 0.5 ? 'Online' : 'Offline'; 
+  
+    }
+
+    ShowData='';
+    EnteredData='';
+
+    onClicked (){
+        this.ShowData="'"+this.EnteredData + "' is textbox Data ";
+    }
+    
+    getColor(){
+        return this.currentStatus ==='online' ? 'green' :'red';
+    }
+    eachItem = '';
+    addItems(){
+        this.repeatItems.push(this.eachItem);
+    }
+    
+
 }
\ No newline at end of file