Skip to content

Commit 5fce3bc

Browse files
committed
Initial commit
0 parents  commit 5fce3bc

13 files changed

+410
-0
lines changed

Diff for: README.md

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
# angular-rxjs-query-fgsou6
2+
3+
[Edit on StackBlitz ⚡️](https://stackblitz.com/edit/angular-rxjs-query-fgsou6)

Diff for: angular.json

+100
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,100 @@
1+
{
2+
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
3+
"version": 1,
4+
"newProjectRoot": "projects",
5+
"projects": {
6+
"demo": {
7+
"root": "",
8+
"sourceRoot": "src",
9+
"projectType": "application",
10+
"prefix": "app",
11+
"schematics": {},
12+
"architect": {
13+
"build": {
14+
"builder": "@angular-devkit/build-angular:browser",
15+
"options": {
16+
"outputPath": "dist/demo",
17+
"index": "src/index.html",
18+
"main": "src/main.ts",
19+
"polyfills": "src/polyfills.ts",
20+
"tsConfig": "src/tsconfig.app.json",
21+
"assets": [
22+
"src/favicon.ico",
23+
"src/assets"
24+
],
25+
"styles": [
26+
"src/styles.css"
27+
],
28+
"scripts": []
29+
},
30+
"configurations": {
31+
"production": {
32+
"fileReplacements": [
33+
{
34+
"replace": "src/environments/environment.ts",
35+
"with": "src/environments/environment.prod.ts"
36+
}
37+
],
38+
"optimization": true,
39+
"outputHashing": "all",
40+
"sourceMap": false,
41+
"extractCss": true,
42+
"namedChunks": false,
43+
"aot": true,
44+
"extractLicenses": true,
45+
"vendorChunk": false,
46+
"buildOptimizer": true
47+
}
48+
}
49+
},
50+
"serve": {
51+
"builder": "@angular-devkit/build-angular:dev-server",
52+
"options": {
53+
"browserTarget": "demo:build"
54+
},
55+
"configurations": {
56+
"production": {
57+
"browserTarget": "demo:build:production"
58+
}
59+
}
60+
},
61+
"extract-i18n": {
62+
"builder": "@angular-devkit/build-angular:extract-i18n",
63+
"options": {
64+
"browserTarget": "demo:build"
65+
}
66+
},
67+
"test": {
68+
"builder": "@angular-devkit/build-angular:karma",
69+
"options": {
70+
"main": "src/test.ts",
71+
"polyfills": "src/polyfills.ts",
72+
"tsConfig": "src/tsconfig.spec.json",
73+
"karmaConfig": "src/karma.conf.js",
74+
"styles": [
75+
"styles.css"
76+
],
77+
"scripts": [],
78+
"assets": [
79+
"src/favicon.ico",
80+
"src/assets"
81+
]
82+
}
83+
},
84+
"lint": {
85+
"builder": "@angular-devkit/build-angular:tslint",
86+
"options": {
87+
"tsConfig": [
88+
"src/tsconfig.app.json",
89+
"src/tsconfig.spec.json"
90+
],
91+
"exclude": [
92+
"**/node_modules/**"
93+
]
94+
}
95+
}
96+
}
97+
}
98+
},
99+
"defaultProject": "demo"
100+
}

Diff for: package.json

+48
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
{
2+
"name": "angular",
3+
"version": "0.0.0",
4+
"private": true,
5+
"dependencies": {
6+
"@angular/animations": "^10.0.0",
7+
"@angular/common": "^10.0.0",
8+
"@angular/compiler": "^10.0.0",
9+
"@angular/core": "^10.0.0",
10+
"@angular/forms": "^10.0.0",
11+
"@angular/platform-browser": "^10.0.0",
12+
"@angular/platform-browser-dynamic": "^10.0.0",
13+
"@angular/router": "^10.0.0",
14+
"core-js": "^3.6.5",
15+
"rxjs": "^6.5.5",
16+
"tslib": "^2.0.0",
17+
"zone.js": "^0.10.3"
18+
},
19+
"scripts": {
20+
"ng": "ng",
21+
"start": "ng serve",
22+
"build": "ng build",
23+
"test": "ng test",
24+
"lint": "ng lint",
25+
"e2e": "ng e2e"
26+
},
27+
"devDependencies": {
28+
"@angular-devkit/build-angular": "~0.10.0",
29+
"@angular/cli": "~7.0.2",
30+
"@angular/compiler-cli": "~7.0.0",
31+
"@angular/language-service": "~7.0.0",
32+
"@types/node": "~8.9.4",
33+
"@types/jasmine": "~2.8.8",
34+
"@types/jasminewd2": "~2.0.3",
35+
"codelyzer": "~4.5.0",
36+
"jasmine-core": "~2.99.1",
37+
"jasmine-spec-reporter": "~4.2.1",
38+
"karma": "~3.0.0",
39+
"karma-chrome-launcher": "~2.2.0",
40+
"karma-coverage-istanbul-reporter": "~2.0.1",
41+
"karma-jasmine": "~1.1.2",
42+
"karma-jasmine-html-reporter": "^0.2.2",
43+
"protractor": "~5.4.0",
44+
"ts-node": "~7.0.0",
45+
"tslint": "~5.11.0",
46+
"typescript": "~3.1.1"
47+
}
48+
}

Diff for: src/app/app.component.css

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
p {
2+
font-family: Lato;
3+
}

Diff for: src/app/app.component.html

+4
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
<hello name="{{ name }}"></hello>
2+
<p>
3+
Start editing to see some magic happen :)
4+
</p>

Diff for: src/app/app.component.ts

+113
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,113 @@
1+
import { Component } from '@angular/core';
2+
import { Observable, from, of, BehaviorSubject } from 'rxjs';
3+
import { filter, flatMap, distinct, take } from 'rxjs/operators';
4+
5+
export class Application {
6+
constructor(private formId: number, private formName: string) {}
7+
private applicants: Array<Applicant> = new Array<Applicant>();
8+
addApplicant(applicant: Applicant) :Application {
9+
this.applicants.push(applicant);
10+
return this;
11+
}
12+
getFormId(): number {
13+
return this.formId;
14+
}
15+
getFormName(): string {
16+
return this.formName;
17+
}
18+
}
19+
20+
export class Applicant {
21+
constructor(id: number, name: string, age:number) {}
22+
}
23+
24+
25+
@Component({
26+
selector: 'my-app',
27+
templateUrl: './app.component.html',
28+
styleUrls: [ './app.component.css' ]
29+
})
30+
export class AppComponent {
31+
name = 'Angular';
32+
33+
private appSubject = new BehaviorSubject<Array<Application>>(null);
34+
private appObs$ : Observable<Array<Application>> = this.appSubject
35+
.pipe(
36+
filter(input => !!input)
37+
);
38+
39+
loadInitialData(): Observable<Array<Application>> {
40+
41+
let app1 = new Application(1, 'Home-Loan')
42+
.addApplicant(new Applicant(1, 'father', 45))
43+
.addApplicant(new Applicant(1, 'mother', 42));
44+
45+
let app2 = new Application(1, 'Car-Loan')
46+
.addApplicant(new Applicant(1, 'father', 45))
47+
.addApplicant(new Applicant(1, 'mother', 42));
48+
49+
let app3 = new Application(1, 'Personnal-Loan')
50+
.addApplicant(new Applicant(1, 'father', 45))
51+
.addApplicant(new Applicant(1, 'mother', 42));
52+
53+
return of([app1, app2, app3]);
54+
}
55+
56+
addApplication(newApplication: Application) {
57+
this.appSubject
58+
.pipe(
59+
take(1)
60+
)
61+
.subscribe(currentData => {
62+
let newData = [...currentData, newApplication];
63+
this.appSubject.next(newData);
64+
});
65+
}
66+
67+
updateApplication(updatedApplication: Application) {
68+
this.appSubject
69+
.pipe(
70+
take(1)
71+
)
72+
.subscribe(currentData => {
73+
const upatedElement = currentData.find(input => input.getFormId === updatedApplication.getFormId);
74+
let newData = [...currentData.splice(currentData.indexOf(upatedElement, 0), 1), updatedApplication];
75+
this.appSubject.next(newData);
76+
});
77+
}
78+
79+
deleteApplication(formId: number) {
80+
this.appSubject
81+
.pipe(
82+
take(1)
83+
)
84+
.subscribe(currentData => {
85+
const upatedElement = currentData.find(input => input.getFormId === formId);
86+
this.appSubject.next(currentData.splice(currentData.indexOf(upatedElement, 0), 1));
87+
});
88+
}
89+
90+
applicationAddStream(): Observable<Application> {
91+
return this.appObs$
92+
.pipe(
93+
flatMap(inputArray => inputArray),
94+
distinct(input => input.getFormId)
95+
)
96+
}
97+
98+
applicationUpdateStream(): Observable<Application> {
99+
return this.appObs$
100+
.pipe(
101+
flatMap(inputArray => inputArray),
102+
distinct(input => input.getFormName)
103+
)
104+
}
105+
106+
applicationDeleteStream(): Observable<Application> {
107+
return this.appObs$
108+
.pipe(
109+
flatMap(inputArray => inputArray),
110+
distinct(input => input.getFormName)
111+
)
112+
}
113+
}

Diff for: src/app/app.module.ts

+13
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
import { NgModule } from '@angular/core';
2+
import { BrowserModule } from '@angular/platform-browser';
3+
import { FormsModule } from '@angular/forms';
4+
5+
import { AppComponent } from './app.component';
6+
import { HelloComponent } from './hello.component';
7+
8+
@NgModule({
9+
imports: [ BrowserModule, FormsModule ],
10+
declarations: [ AppComponent, HelloComponent ],
11+
bootstrap: [ AppComponent ]
12+
})
13+
export class AppModule { }

Diff for: src/app/hello.component.ts

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
import { Component, Input } from '@angular/core';
2+
3+
@Component({
4+
selector: 'hello',
5+
template: `<h1>Hello {{name}}!</h1>`,
6+
styles: [`h1 { font-family: Lato; }`]
7+
})
8+
export class HelloComponent {
9+
@Input() name: string;
10+
}

Diff for: src/index.html

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
<my-app>loading</my-app>

Diff for: src/main.ts

+16
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
import './polyfills';
2+
3+
import { enableProdMode } from '@angular/core';
4+
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
5+
6+
import { AppModule } from './app/app.module';
7+
8+
platformBrowserDynamic().bootstrapModule(AppModule).then(ref => {
9+
// Ensure Angular destroys itself on hot reloads.
10+
if (window['ngRef']) {
11+
window['ngRef'].destroy();
12+
}
13+
window['ngRef'] = ref;
14+
15+
// Otherwise, log the boot error
16+
}).catch(err => console.error(err));

0 commit comments

Comments
 (0)