From 101304d76fba27a807ec41b8c78294715e31531f Mon Sep 17 00:00:00 2001 From: eminda Date: Thu, 28 Sep 2017 16:08:21 +0530 Subject: [PATCH 1/4] Http request workings --- src/app/app.component.html | 1 + src/app/app.module.ts | 10 ++++-- src/app/http/http.component.css | 0 src/app/http/http.component.html | 4 +++ src/app/http/http.component.spec.ts | 25 +++++++++++++ src/app/http/http.component.ts | 54 +++++++++++++++++++++++++++++ 6 files changed, 91 insertions(+), 3 deletions(-) create mode 100644 src/app/http/http.component.css create mode 100644 src/app/http/http.component.html create mode 100644 src/app/http/http.component.spec.ts create mode 100644 src/app/http/http.component.ts diff --git a/src/app/app.component.html b/src/app/app.component.html index 109e680..6269b86 100644 --- a/src/app/app.component.html +++ b/src/app/app.component.html @@ -3,6 +3,7 @@ Directive Form Angular Service + Http diff --git a/src/app/app.module.ts b/src/app/app.module.ts index a5cf300..cab55a0 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -24,6 +24,8 @@ import {AngularServicesComponent} from './angular-services/angular-services.comp import {Demo1Component} from './angular-services/demo1/demo1.component'; import {Demo2Component} from './angular-services/demo2/demo2.component'; import {ValueStoreService} from "./angular-services/value-store.service"; +import {HttpComponent} from './http/http.component'; +import {HttpClient, HttpClientModule} from "@angular/common/http"; const appRoutes: Routes = [ {path: 'directive', component: AngularDirectivesComponent}, @@ -47,6 +49,7 @@ const appRoutes: Routes = [ {path: 'demo2', component: Demo2Component} ] }, + {path: 'http', component: HttpComponent} ]; @@ -71,16 +74,17 @@ const appRoutes: Routes = [ Form9Component, AngularServicesComponent, Demo1Component, - Demo2Component + Demo2Component, + HttpComponent ], imports: [ BrowserModule, FormsModule, RouterModule.forRoot( appRoutes // , // {enableTracing: true} // <-- debugging purposes only - ), ReactiveFormsModule + ), ReactiveFormsModule, HttpClientModule ], - providers: [ValueStoreService], + providers: [ValueStoreService, HttpClient], bootstrap: [AppComponent] }) export class AppModule { diff --git a/src/app/http/http.component.css b/src/app/http/http.component.css new file mode 100644 index 0000000..e69de29 diff --git a/src/app/http/http.component.html b/src/app/http/http.component.html new file mode 100644 index 0000000..0cd4c3a --- /dev/null +++ b/src/app/http/http.component.html @@ -0,0 +1,4 @@ + + +
+{{object |json}} diff --git a/src/app/http/http.component.spec.ts b/src/app/http/http.component.spec.ts new file mode 100644 index 0000000..bbb6d5c --- /dev/null +++ b/src/app/http/http.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { HttpComponent } from './http.component'; + +describe('HttpComponent', () => { + let component: HttpComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ HttpComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(HttpComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should be created', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/http/http.component.ts b/src/app/http/http.component.ts new file mode 100644 index 0000000..928a6bb --- /dev/null +++ b/src/app/http/http.component.ts @@ -0,0 +1,54 @@ +import {Component, OnDestroy, OnInit} from '@angular/core'; +import {HttpClient} from "@angular/common/http"; +import "rxjs/add/operator/takeWhile"; +import {Subscription} from "rxjs/Subscription"; + +@Component({ + selector: 'app-http', + templateUrl: './http.component.html', + styleUrls: ['./http.component.css'] +}) +export class HttpComponent implements OnInit, OnDestroy { + + object: any; + alive = true; + subscription: Subscription; + + constructor(private httpClient: HttpClient) { + } + + ngOnInit() { + } + + ngOnDestroy(): void { + this.alive = false; + this.subscription.unsubscribe(); + } + + requestGet() { + this.httpClient.get('http://httpbin.org/headers').subscribe(data => { + // Read the result field from the JSON response. + this.object = data['headers']; + }); + } + + requestPost() { + this.httpClient.post('http://httpbin.org/post', {}).takeWhile(() => this.alive).subscribe(data => { + // Read the result field from the JSON response. + this.object = data['headers']; + }); + } + + requestGetUnsubscribeWay() { + this.subscription = this.httpClient.get('http://httpbin.org/headers').subscribe(data => { + // Read the result field from the JSON response. + this.object = data['headers']; + }); + // const sub = this.httpClient.get('http://httpbin.org/headers').subscribe(data => { + // // Read the result field from the JSON response. + // this.object = data['headers']; + // }); + // this.subscription.add(sub); + } + +} From f95a96d3eb253dc210bf9cf48bf8923a39c73896 Mon Sep 17 00:00:00 2001 From: eminda Date: Thu, 28 Sep 2017 16:08:21 +0530 Subject: [PATCH 2/4] Http request workings --- src/app/app.component.html | 1 + src/app/app.module.ts | 10 ++++-- src/app/http/http.component.css | 0 src/app/http/http.component.html | 4 +++ src/app/http/http.component.spec.ts | 25 +++++++++++++ src/app/http/http.component.ts | 56 +++++++++++++++++++++++++++++ 6 files changed, 93 insertions(+), 3 deletions(-) create mode 100644 src/app/http/http.component.css create mode 100644 src/app/http/http.component.html create mode 100644 src/app/http/http.component.spec.ts create mode 100644 src/app/http/http.component.ts diff --git a/src/app/app.component.html b/src/app/app.component.html index 109e680..6269b86 100644 --- a/src/app/app.component.html +++ b/src/app/app.component.html @@ -3,6 +3,7 @@ Directive Form Angular Service + Http diff --git a/src/app/app.module.ts b/src/app/app.module.ts index a5cf300..cab55a0 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -24,6 +24,8 @@ import {AngularServicesComponent} from './angular-services/angular-services.comp import {Demo1Component} from './angular-services/demo1/demo1.component'; import {Demo2Component} from './angular-services/demo2/demo2.component'; import {ValueStoreService} from "./angular-services/value-store.service"; +import {HttpComponent} from './http/http.component'; +import {HttpClient, HttpClientModule} from "@angular/common/http"; const appRoutes: Routes = [ {path: 'directive', component: AngularDirectivesComponent}, @@ -47,6 +49,7 @@ const appRoutes: Routes = [ {path: 'demo2', component: Demo2Component} ] }, + {path: 'http', component: HttpComponent} ]; @@ -71,16 +74,17 @@ const appRoutes: Routes = [ Form9Component, AngularServicesComponent, Demo1Component, - Demo2Component + Demo2Component, + HttpComponent ], imports: [ BrowserModule, FormsModule, RouterModule.forRoot( appRoutes // , // {enableTracing: true} // <-- debugging purposes only - ), ReactiveFormsModule + ), ReactiveFormsModule, HttpClientModule ], - providers: [ValueStoreService], + providers: [ValueStoreService, HttpClient], bootstrap: [AppComponent] }) export class AppModule { diff --git a/src/app/http/http.component.css b/src/app/http/http.component.css new file mode 100644 index 0000000..e69de29 diff --git a/src/app/http/http.component.html b/src/app/http/http.component.html new file mode 100644 index 0000000..0cd4c3a --- /dev/null +++ b/src/app/http/http.component.html @@ -0,0 +1,4 @@ + + +
+{{object |json}} diff --git a/src/app/http/http.component.spec.ts b/src/app/http/http.component.spec.ts new file mode 100644 index 0000000..bbb6d5c --- /dev/null +++ b/src/app/http/http.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { HttpComponent } from './http.component'; + +describe('HttpComponent', () => { + let component: HttpComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ HttpComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(HttpComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should be created', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/http/http.component.ts b/src/app/http/http.component.ts new file mode 100644 index 0000000..189efba --- /dev/null +++ b/src/app/http/http.component.ts @@ -0,0 +1,56 @@ +import {Component, OnDestroy, OnInit} from '@angular/core'; +import {HttpClient} from "@angular/common/http"; +import "rxjs/add/operator/takeWhile"; +import {Subscription} from "rxjs/Subscription"; + +@Component({ + selector: 'app-http', + templateUrl: './http.component.html', + styleUrls: ['./http.component.css'] +}) +export class HttpComponent implements OnInit, OnDestroy { + + object: any; + alive = true; + subscription: Subscription; + + constructor(private httpClient: HttpClient) { + } + + ngOnInit() { + } + + ngOnDestroy(): void { + this.alive = false; + if (this.subscription) { + this.subscription.unsubscribe(); + } + } + + requestGet() { + this.httpClient.get('http://httpbin.org/headers').subscribe(data => { + // Read the result field from the JSON response. + this.object = data['headers']; + }); + } + + requestPost() { + this.httpClient.post('http://httpbin.org/post', {}).takeWhile(() => this.alive).subscribe(data => { + // Read the result field from the JSON response. + this.object = data['headers']; + }); + } + + requestGetUnsubscribeWay() { + this.subscription = this.httpClient.get('http://httpbin.org/headers').subscribe(data => { + // Read the result field from the JSON response. + this.object = data['headers']; + }); + // const sub = this.httpClient.get('http://httpbin.org/headers').subscribe(data => { + // // Read the result field from the JSON response. + // this.object = data['headers']; + // }); + // this.subscription.add(sub); + } + +} From 0b98dcf4aafc28703766b76934bf3d730c889bd5 Mon Sep 17 00:00:00 2001 From: eminda Date: Thu, 28 Sep 2017 17:44:30 +0530 Subject: [PATCH 3/4] Pipe work --- src/app/app.component.html | 1 + src/app/app.module.ts | 11 ++++++++--- src/app/pipe/filter-pipe.pipe.spec.ts | 8 ++++++++ src/app/pipe/filter-pipe.pipe.ts | 16 ++++++++++++++++ src/app/pipe/pipe.component.css | 0 src/app/pipe/pipe.component.html | 23 +++++++++++++++++++++++ src/app/pipe/pipe.component.spec.ts | 25 +++++++++++++++++++++++++ src/app/pipe/pipe.component.ts | 22 ++++++++++++++++++++++ 8 files changed, 103 insertions(+), 3 deletions(-) create mode 100644 src/app/pipe/filter-pipe.pipe.spec.ts create mode 100644 src/app/pipe/filter-pipe.pipe.ts create mode 100644 src/app/pipe/pipe.component.css create mode 100644 src/app/pipe/pipe.component.html create mode 100644 src/app/pipe/pipe.component.spec.ts create mode 100644 src/app/pipe/pipe.component.ts diff --git a/src/app/app.component.html b/src/app/app.component.html index 6269b86..0a0a809 100644 --- a/src/app/app.component.html +++ b/src/app/app.component.html @@ -4,6 +4,7 @@ Form Angular Service Http + Pipe diff --git a/src/app/app.module.ts b/src/app/app.module.ts index cab55a0..4973d62 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -26,6 +26,8 @@ import {Demo2Component} from './angular-services/demo2/demo2.component'; import {ValueStoreService} from "./angular-services/value-store.service"; import {HttpComponent} from './http/http.component'; import {HttpClient, HttpClientModule} from "@angular/common/http"; +import {PipeComponent} from './pipe/pipe.component'; +import {FilterPipePipe} from './pipe/filter-pipe.pipe'; const appRoutes: Routes = [ {path: 'directive', component: AngularDirectivesComponent}, @@ -49,7 +51,8 @@ const appRoutes: Routes = [ {path: 'demo2', component: Demo2Component} ] }, - {path: 'http', component: HttpComponent} + {path: 'http', component: HttpComponent}, + {path: 'pipe', component: PipeComponent} ]; @@ -75,7 +78,9 @@ const appRoutes: Routes = [ AngularServicesComponent, Demo1Component, Demo2Component, - HttpComponent + HttpComponent, + PipeComponent, + FilterPipePipe ], imports: [ BrowserModule, FormsModule, RouterModule.forRoot( @@ -84,7 +89,7 @@ const appRoutes: Routes = [ // {enableTracing: true} // <-- debugging purposes only ), ReactiveFormsModule, HttpClientModule ], - providers: [ValueStoreService, HttpClient], + providers: [ValueStoreService, HttpClient, FilterPipePipe], bootstrap: [AppComponent] }) export class AppModule { diff --git a/src/app/pipe/filter-pipe.pipe.spec.ts b/src/app/pipe/filter-pipe.pipe.spec.ts new file mode 100644 index 0000000..610fd02 --- /dev/null +++ b/src/app/pipe/filter-pipe.pipe.spec.ts @@ -0,0 +1,8 @@ +import { FilterPipePipe } from './filter-pipe.pipe'; + +describe('FilterPipePipe', () => { + it('create an instance', () => { + const pipe = new FilterPipePipe(); + expect(pipe).toBeTruthy(); + }); +}); diff --git a/src/app/pipe/filter-pipe.pipe.ts b/src/app/pipe/filter-pipe.pipe.ts new file mode 100644 index 0000000..f005434 --- /dev/null +++ b/src/app/pipe/filter-pipe.pipe.ts @@ -0,0 +1,16 @@ +import {Pipe, PipeTransform} from '@angular/core'; + +@Pipe({ + name: 'filterPipe' +}) +export class FilterPipePipe implements PipeTransform { + + transform(items: any, name: any): any { + if (name) { + items = items.filter( + item => item.name.toUpperCase().startsWith(name.toUpperCase())); + } + return items; + } + +} diff --git a/src/app/pipe/pipe.component.css b/src/app/pipe/pipe.component.css new file mode 100644 index 0000000..e69de29 diff --git a/src/app/pipe/pipe.component.html b/src/app/pipe/pipe.component.html new file mode 100644 index 0000000..a0ac159 --- /dev/null +++ b/src/app/pipe/pipe.component.html @@ -0,0 +1,23 @@ +Without Pipe +
+{{data}} +
+
+With Pipe +
+{{data|json }} +
+
+For loop without filtering of pipes +
+ {{person|json}} +
+
+
+For loop With Custom Pipe + +
+
+
+ {{person|json}} +
diff --git a/src/app/pipe/pipe.component.spec.ts b/src/app/pipe/pipe.component.spec.ts new file mode 100644 index 0000000..ba50ead --- /dev/null +++ b/src/app/pipe/pipe.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { PipeComponent } from './pipe.component'; + +describe('PipeComponent', () => { + let component: PipeComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ PipeComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(PipeComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should be created', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/pipe/pipe.component.ts b/src/app/pipe/pipe.component.ts new file mode 100644 index 0000000..a28f45f --- /dev/null +++ b/src/app/pipe/pipe.component.ts @@ -0,0 +1,22 @@ +import {Component, OnInit} from '@angular/core'; + +@Component({ + selector: 'app-pipe', + templateUrl: './pipe.component.html', + styleUrls: ['./pipe.component.css'] +}) +export class PipeComponent implements OnInit { + data = {name: 'Kamal', city: 'Moratuwa'}; + + people = [{name: 'Nimal', city: 'Colombo'}, {name: 'Kammaliya', city: 'Nugegoda'}, {name: 'Sunil', city: 'Kandy'}, + {name: 'Nirmal', city: 'Ambalangoda'}]; + + name; + + constructor() { + } + + ngOnInit() { + } + +} From 97f4850e01786437d58355bbdb0bc9099ec48a01 Mon Sep 17 00:00:00 2001 From: eminda Date: Thu, 28 Sep 2017 18:58:55 +0530 Subject: [PATCH 4/4] Event in Angular 4 --- src/app/app.component.html | 1 + src/app/app.module.ts | 9 ++++- .../bank-ledger/bank-ledger.component.css | 0 .../bank-ledger/bank-ledger.component.html | 11 ++++++ .../bank-ledger/bank-ledger.component.spec.ts | 25 ++++++++++++ .../bank-ledger/bank-ledger.component.ts | 38 +++++++++++++++++++ ...mmunicate-between-components.component.css | 0 ...municate-between-components.component.html | 18 +++++++++ ...icate-between-components.component.spec.ts | 25 ++++++++++++ ...ommunicate-between-components.component.ts | 31 +++++++++++++++ 10 files changed, 156 insertions(+), 2 deletions(-) create mode 100644 src/app/communicate-between-components/bank-ledger/bank-ledger.component.css create mode 100644 src/app/communicate-between-components/bank-ledger/bank-ledger.component.html create mode 100644 src/app/communicate-between-components/bank-ledger/bank-ledger.component.spec.ts create mode 100644 src/app/communicate-between-components/bank-ledger/bank-ledger.component.ts create mode 100644 src/app/communicate-between-components/communicate-between-components.component.css create mode 100644 src/app/communicate-between-components/communicate-between-components.component.html create mode 100644 src/app/communicate-between-components/communicate-between-components.component.spec.ts create mode 100644 src/app/communicate-between-components/communicate-between-components.component.ts diff --git a/src/app/app.component.html b/src/app/app.component.html index 0a0a809..6e1bfaf 100644 --- a/src/app/app.component.html +++ b/src/app/app.component.html @@ -5,6 +5,7 @@ Angular Service Http Pipe + Event diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 4973d62..fdd0f85 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -28,6 +28,8 @@ import {HttpComponent} from './http/http.component'; import {HttpClient, HttpClientModule} from "@angular/common/http"; import {PipeComponent} from './pipe/pipe.component'; import {FilterPipePipe} from './pipe/filter-pipe.pipe'; +import { CommunicateBetweenComponentsComponent } from './communicate-between-components/communicate-between-components.component'; +import { BankLedgerComponent } from './communicate-between-components/bank-ledger/bank-ledger.component'; const appRoutes: Routes = [ {path: 'directive', component: AngularDirectivesComponent}, @@ -52,7 +54,8 @@ const appRoutes: Routes = [ ] }, {path: 'http', component: HttpComponent}, - {path: 'pipe', component: PipeComponent} + {path: 'pipe', component: PipeComponent}, + {path: 'event', component: CommunicateBetweenComponentsComponent} ]; @@ -80,7 +83,9 @@ const appRoutes: Routes = [ Demo2Component, HttpComponent, PipeComponent, - FilterPipePipe + FilterPipePipe, + CommunicateBetweenComponentsComponent, + BankLedgerComponent ], imports: [ BrowserModule, FormsModule, RouterModule.forRoot( diff --git a/src/app/communicate-between-components/bank-ledger/bank-ledger.component.css b/src/app/communicate-between-components/bank-ledger/bank-ledger.component.css new file mode 100644 index 0000000..e69de29 diff --git a/src/app/communicate-between-components/bank-ledger/bank-ledger.component.html b/src/app/communicate-between-components/bank-ledger/bank-ledger.component.html new file mode 100644 index 0000000..49a185c --- /dev/null +++ b/src/app/communicate-between-components/bank-ledger/bank-ledger.component.html @@ -0,0 +1,11 @@ +
+

Fine Customer


+ +
+ +
+ {{leg}} +
+
+
+
diff --git a/src/app/communicate-between-components/bank-ledger/bank-ledger.component.spec.ts b/src/app/communicate-between-components/bank-ledger/bank-ledger.component.spec.ts new file mode 100644 index 0000000..954b6c0 --- /dev/null +++ b/src/app/communicate-between-components/bank-ledger/bank-ledger.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { BankLedgerComponent } from './bank-ledger.component'; + +describe('BankLedgerComponent', () => { + let component: BankLedgerComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ BankLedgerComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(BankLedgerComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should be created', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/communicate-between-components/bank-ledger/bank-ledger.component.ts b/src/app/communicate-between-components/bank-ledger/bank-ledger.component.ts new file mode 100644 index 0000000..5a14917 --- /dev/null +++ b/src/app/communicate-between-components/bank-ledger/bank-ledger.component.ts @@ -0,0 +1,38 @@ +import {Component, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges} from '@angular/core'; + +@Component({ + selector: 'app-bank-ledger', + templateUrl: './bank-ledger.component.html', + styleUrls: ['./bank-ledger.component.css'] +}) +export class BankLedgerComponent implements OnInit, OnChanges { + + @Input() + deposit; + + @Output() + private sms = new EventEmitter(); + + ledger = []; + + + constructor() { + } + + ngOnChanges(changes: SimpleChanges): void { + if (changes.deposit && !changes.deposit.isFirstChange()) { + this.ledger.push('Deposit : ' + this.deposit); + this.sms.emit('Deposit Happened : ' + this.deposit); + } + } + + ngOnInit() { + } + + fineCustomer(value: any) { + this.ledger.push('Fine : ' + value); + this.sms.emit('Bank Charges applied for your account : ' + value); + } + + +} diff --git a/src/app/communicate-between-components/communicate-between-components.component.css b/src/app/communicate-between-components/communicate-between-components.component.css new file mode 100644 index 0000000..e69de29 diff --git a/src/app/communicate-between-components/communicate-between-components.component.html b/src/app/communicate-between-components/communicate-between-components.component.html new file mode 100644 index 0000000..6b21c0b --- /dev/null +++ b/src/app/communicate-between-components/communicate-between-components.component.html @@ -0,0 +1,18 @@ +
+
+

Welcome to banking System

+ + Enter Your Deposit +
+ +
+ +
+
+ SMS came :
+ {{sms}} +
+ + + +
diff --git a/src/app/communicate-between-components/communicate-between-components.component.spec.ts b/src/app/communicate-between-components/communicate-between-components.component.spec.ts new file mode 100644 index 0000000..552916c --- /dev/null +++ b/src/app/communicate-between-components/communicate-between-components.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { CommunicateBetweenComponentsComponent } from './communicate-between-components.component'; + +describe('CommunicateBetweenComponentsComponent', () => { + let component: CommunicateBetweenComponentsComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ CommunicateBetweenComponentsComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(CommunicateBetweenComponentsComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should be created', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/communicate-between-components/communicate-between-components.component.ts b/src/app/communicate-between-components/communicate-between-components.component.ts new file mode 100644 index 0000000..d97b140 --- /dev/null +++ b/src/app/communicate-between-components/communicate-between-components.component.ts @@ -0,0 +1,31 @@ +import {Component, OnInit} from '@angular/core'; + +@Component({ + selector: 'app-communicate-between-components', + templateUrl: './communicate-between-components.component.html', + styleUrls: ['./communicate-between-components.component.css'] +}) +export class CommunicateBetweenComponentsComponent implements OnInit { + value = 0; + latestDeposit: Number; + sms; + + constructor() { + } + + ngOnInit() { + } + + deposit(value: any) { + this.latestDeposit = value; + } + + getDeposit() { + return this.latestDeposit; + } + + showSMS(event) { + this.sms = event; + } + +}