├── .DS_Store ├── AngularUnitTesting ├── .DS_Store ├── .editorconfig ├── .gitignore ├── README.md ├── angular.json ├── e2e │ ├── app.e2e-spec.ts │ ├── app.po.ts │ └── tsconfig.e2e.json ├── package-lock.json ├── package.json ├── protractor.conf.js ├── src │ ├── .DS_Store │ ├── app │ │ ├── app-routing.module.ts │ │ ├── app.component.css │ │ ├── app.component.html │ │ ├── app.component.ts │ │ ├── app.module.ts │ │ ├── dashboard │ │ │ ├── dashboard.component.css │ │ │ ├── dashboard.component.html │ │ │ └── dashboard.component.ts │ │ ├── first.spec.ts │ │ ├── hero-detail │ │ │ ├── hero-detail.component.css │ │ │ ├── hero-detail.component.html │ │ │ └── hero-detail.component.ts │ │ ├── hero-search │ │ │ ├── hero-search.component.css │ │ │ ├── hero-search.component.html │ │ │ └── hero-search.component.ts │ │ ├── hero.service.ts │ │ ├── hero.ts │ │ ├── hero │ │ │ ├── hero.component.css │ │ │ ├── hero.component.html │ │ │ └── hero.component.ts │ │ ├── heroes │ │ │ ├── heroes.component.css │ │ │ ├── heroes.component.html │ │ │ └── heroes.component.ts │ │ ├── in-memory-data.service.ts │ │ ├── message.service.spec.ts │ │ ├── message.service.ts │ │ ├── messages │ │ │ ├── messages.component.css │ │ │ ├── messages.component.html │ │ │ └── messages.component.ts │ │ └── strength │ │ │ ├── strength.pipe.spec.ts │ │ │ └── strength.pipe.ts │ ├── environments │ │ ├── environment.prod.ts │ │ └── environment.ts │ ├── favicon.ico │ ├── index.html │ ├── karma.conf.js │ ├── main.ts │ ├── polyfills.ts │ ├── styles.css │ ├── test.ts │ ├── tsconfig.app.json │ └── tsconfig.spec.json ├── tsconfig.json └── tslint.json ├── JWT ├── .DS_Store ├── .gitignore ├── app.js ├── auth │ └── AuthController.js ├── config.js ├── db.js ├── package-lock.json ├── package.json ├── server.js └── user │ └── User.js ├── README.md ├── data ├── artistsample.json ├── moviessample.json ├── newsample.json ├── property.json └── restaurantssample.json ├── extra ├── firstapp ├── .editorconfig ├── .gitignore ├── Dockerfile ├── README.md ├── angular.json ├── e2e │ ├── protractor.conf.js │ ├── src │ │ ├── app.e2e-spec.ts │ │ └── app.po.ts │ └── tsconfig.e2e.json ├── package-lock.json ├── package.json ├── src │ ├── app │ │ ├── app.component.html │ │ ├── app.component.ts │ │ ├── app.module.ts │ │ ├── home │ │ │ ├── home.component.css │ │ │ ├── home.component.html │ │ │ └── home.component.ts │ │ ├── movies.component.ts │ │ ├── music │ │ │ ├── music.component.css │ │ │ ├── music.component.html │ │ │ ├── music.component.ts │ │ │ ├── music.module.ts │ │ │ └── music.service.ts │ │ ├── orders │ │ │ ├── orders.component.css │ │ │ ├── orders.component.html │ │ │ └── orders.component.ts │ │ ├── products │ │ │ ├── myDiscount.pipe.ts │ │ │ ├── myUpper.pipe.ts │ │ │ ├── product-detail.component.html │ │ │ ├── product-detail.component.ts │ │ │ ├── product.component.css │ │ │ ├── product.component.html │ │ │ ├── product.component.ts │ │ │ ├── product.model.ts │ │ │ ├── product.module.ts │ │ │ ├── product.service.ts │ │ │ ├── productFilter.pipe.ts │ │ │ └── product_bk.component │ │ └── shared │ │ │ ├── notFound.component.ts │ │ │ ├── star.component.css │ │ │ ├── star.component.html │ │ │ └── star.component.ts │ ├── assets │ │ ├── .gitkeep │ │ └── loading.gif │ ├── browserslist │ ├── environments │ │ ├── environment.prod.ts │ │ └── environment.ts │ ├── favicon.ico │ ├── index.html │ ├── karma.conf.js │ ├── main.ts │ ├── polyfills.ts │ ├── styles.css │ ├── test.ts │ ├── tsconfig.app.json │ ├── tsconfig.spec.json │ └── tslint.json ├── tsconfig.json └── tslint.json ├── learnpackage ├── package-lock.json └── package.json ├── loginapp ├── .editorconfig ├── .gitignore ├── README.md ├── angular.json ├── e2e │ ├── protractor.conf.js │ ├── src │ │ ├── app.e2e-spec.ts │ │ └── app.po.ts │ └── tsconfig.e2e.json ├── package-lock.json ├── package.json ├── src │ ├── app │ │ ├── app-routing.module.ts │ │ ├── app.component.css │ │ ├── app.component.html │ │ ├── app.component.spec.ts │ │ ├── app.component.ts │ │ ├── app.module.ts │ │ ├── login-form │ │ │ ├── login-form.component.html │ │ │ ├── login-form.component.ts │ │ │ ├── login.model.ts │ │ │ └── login.service.ts │ │ ├── profile-guard.service.ts │ │ ├── profile │ │ │ ├── profile.component.html │ │ │ └── profile.component.ts │ │ ├── register-form │ │ │ ├── register-form.component.html │ │ │ ├── register-form.component.ts │ │ │ ├── register.model.ts │ │ │ └── register.service.ts │ │ └── register-gaurd.service.ts │ ├── assets │ │ └── .gitkeep │ ├── browserslist │ ├── environments │ │ ├── environment.prod.ts │ │ └── environment.ts │ ├── favicon.ico │ ├── index.html │ ├── karma.conf.js │ ├── main.ts │ ├── polyfills.ts │ ├── styles.css │ ├── test.ts │ ├── tsconfig.app.json │ ├── tsconfig.spec.json │ └── tslint.json ├── tsconfig.json └── tslint.json ├── ngServer-master ├── .DS_Store ├── .gitignore ├── package-lock.json ├── package.json └── server.js ├── reactiveForm ├── .editorconfig ├── .gitignore ├── README.md ├── angular.json ├── e2e │ ├── protractor.conf.js │ ├── src │ │ ├── app.e2e-spec.ts │ │ └── app.po.ts │ └── tsconfig.e2e.json ├── package-lock.json ├── package.json ├── src │ ├── app │ │ ├── app-routing.module.ts │ │ ├── app.component.css │ │ ├── app.component.html │ │ ├── app.component.spec.ts │ │ ├── app.component.ts │ │ ├── app.module.ts │ │ └── employee │ │ │ ├── employe.component.ts │ │ │ └── employee.component.html │ ├── assets │ │ └── .gitkeep │ ├── browserslist │ ├── environments │ │ ├── environment.prod.ts │ │ └── environment.ts │ ├── favicon.ico │ ├── index.html │ ├── karma.conf.js │ ├── main.ts │ ├── polyfills.ts │ ├── styles.css │ ├── test.ts │ ├── tsconfig.app.json │ ├── tsconfig.spec.json │ └── tslint.json ├── tsconfig.json └── tslint.json └── templateForm ├── .editorconfig ├── .gitignore ├── README.md ├── angular.json ├── e2e ├── protractor.conf.js ├── src │ ├── app.e2e-spec.ts │ └── app.po.ts └── tsconfig.e2e.json ├── package-lock.json ├── package.json ├── src ├── app │ ├── app-routing.module.ts │ ├── app.component.css │ ├── app.component.html │ ├── app.component.spec.ts │ ├── app.component.ts │ ├── app.module.ts │ ├── customer-form │ │ ├── customer-form.component.html │ │ └── customer-form.component.ts │ ├── models │ │ └── CustomerModal.ts │ └── services │ │ └── form-poster.service.ts ├── assets │ └── .gitkeep ├── browserslist ├── environments │ ├── environment.prod.ts │ └── environment.ts ├── favicon.ico ├── index.html ├── karma.conf.js ├── main.ts ├── polyfills.ts ├── styles.css ├── test.ts ├── tsconfig.app.json ├── tsconfig.spec.json └── tslint.json ├── tsconfig.json └── tslint.json /.DS_Store: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Aakashdeveloper/EDU_APR_ANG_MRNG/6dd4be6100bb82d97011392ac966f0126db01702/.DS_Store -------------------------------------------------------------------------------- /AngularUnitTesting/.DS_Store: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Aakashdeveloper/EDU_APR_ANG_MRNG/6dd4be6100bb82d97011392ac966f0126db01702/AngularUnitTesting/.DS_Store -------------------------------------------------------------------------------- /AngularUnitTesting/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see http://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /AngularUnitTesting/.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | -------------------------------------------------------------------------------- /AngularUnitTesting/README.md: -------------------------------------------------------------------------------- 1 | # Pluralsight's Unit Testing in Angular Course 2 | This course is up to date. 3 | 4 | To get started, clone the repo or download it 5 | 6 | npm install 7 | npm test 8 | -------------------------------------------------------------------------------- /AngularUnitTesting/angular.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "./node_modules/@angular/cli/lib/config/schema.json", 3 | "version": 1, 4 | "newProjectRoot": "projects", 5 | "projects": { 6 | "angular-test": { 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/angular-test", 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 | "./node_modules/toastr/build/toastr.min.css", 27 | "src/styles.css" 28 | ], 29 | "scripts": [ 30 | "./node_modules/jquery/dist/jquery.min.js", 31 | "./node_modules/toastr/build/toastr.min.js", 32 | "./node_modules/bootstrap/dist/js/bootstrap.js" 33 | ] 34 | }, 35 | "configurations": { 36 | "production": { 37 | "fileReplacements": [ 38 | { 39 | "replace": "src/environments/environment.ts", 40 | "with": "src/environments/environment.prod.ts" 41 | } 42 | ], 43 | "optimization": true, 44 | "outputHashing": "all", 45 | "sourceMap": false, 46 | "extractCss": true, 47 | "namedChunks": false, 48 | "aot": true, 49 | "extractLicenses": true, 50 | "vendorChunk": false, 51 | "buildOptimizer": true 52 | } 53 | } 54 | }, 55 | "serve": { 56 | "builder": "@angular-devkit/build-angular:dev-server", 57 | "options": { 58 | "browserTarget": "angular-test:build" 59 | }, 60 | "configurations": { 61 | "production": { 62 | "browserTarget": "angular-test:build:production" 63 | } 64 | } 65 | }, 66 | "extract-i18n": { 67 | "builder": "@angular-devkit/build-angular:extract-i18n", 68 | "options": { 69 | "browserTarget": "angular-test:build" 70 | } 71 | }, 72 | "test": { 73 | "builder": "@angular-devkit/build-angular:karma", 74 | "options": { 75 | "main": "src/test.ts", 76 | "polyfills": "src/polyfills.ts", 77 | "tsConfig": "src/tsconfig.spec.json", 78 | "karmaConfig": "src/karma.conf.js", 79 | "styles": [ 80 | "src/styles.css" 81 | ], 82 | "scripts": [], 83 | "assets": [ 84 | "src/favicon.ico", 85 | "src/assets" 86 | ] 87 | } 88 | }, 89 | "lint": { 90 | "builder": "@angular-devkit/build-angular:tslint", 91 | "options": { 92 | "tsConfig": [ 93 | "src/tsconfig.app.json", 94 | "src/tsconfig.spec.json" 95 | ], 96 | "exclude": [ 97 | "**/node_modules/**" 98 | ] 99 | } 100 | } 101 | } 102 | }, 103 | "angular-test-e2e": { 104 | "root": "e2e/", 105 | "projectType": "application", 106 | "architect": { 107 | "e2e": { 108 | "builder": "@angular-devkit/build-angular:protractor", 109 | "options": { 110 | "protractorConfig": "e2e/protractor.conf.js", 111 | "devServerTarget": "angular-test:serve" 112 | }, 113 | "configurations": { 114 | "production": { 115 | "devServerTarget": "angular-test:serve:production" 116 | } 117 | } 118 | }, 119 | "lint": { 120 | "builder": "@angular-devkit/build-angular:tslint", 121 | "options": { 122 | "tsConfig": "e2e/tsconfig.e2e.json", 123 | "exclude": [ 124 | "**/node_modules/**" 125 | ] 126 | } 127 | } 128 | } 129 | } 130 | }, 131 | "defaultProject": "angular-test" 132 | } -------------------------------------------------------------------------------- /AngularUnitTesting/e2e/app.po.ts: -------------------------------------------------------------------------------- 1 | import { browser, by, element } from 'protractor'; 2 | 3 | export class AppPage { 4 | navigateTo() { 5 | return browser.get('/'); 6 | } 7 | 8 | getParagraphText() { 9 | return element(by.css('app-root h1')).getText(); 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /AngularUnitTesting/e2e/tsconfig.e2e.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/e2e", 5 | "baseUrl": "./", 6 | "module": "commonjs", 7 | "target": "es5", 8 | "types": [ 9 | "jasmine", 10 | "jasminewd2", 11 | "node" 12 | ] 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /AngularUnitTesting/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "angular-io-example", 3 | "version": "1.0.0", 4 | "private": true, 5 | "description": "Example project from an angular.io guide.", 6 | "scripts": { 7 | "ng": "ng", 8 | "build": "ng build --prod", 9 | "start": "ng serve", 10 | "test": "ng test", 11 | "lint": "tslint ./src/**/*.ts -t verbose", 12 | "e2e": "ng e2e" 13 | }, 14 | "keywords": [], 15 | "author": "", 16 | "license": "MIT", 17 | "dependencies": { 18 | "@angular/animations": "7.1.2", 19 | "@angular/common": "7.1.2", 20 | "@angular/compiler": "7.1.2", 21 | "@angular/core": "7.1.2", 22 | "@angular/forms": "7.1.2", 23 | "@angular/http": "7.1.2", 24 | "@angular/platform-browser": "7.1.2", 25 | "@angular/platform-browser-dynamic": "7.1.2", 26 | "@angular/router": "7.1.2", 27 | "angular-in-memory-web-api": "0.7.0", 28 | "bootstrap": "4.1.3", 29 | "core-js": "2.5.4", 30 | "jquery": "3.3.1", 31 | "rxjs": "6.3.3", 32 | "toastr": "2.1.4", 33 | "zone.js": "0.8.26" 34 | }, 35 | "devDependencies": { 36 | "@angular-devkit/build-angular": "0.11.2", 37 | "@angular/cli": "7.1.2", 38 | "@angular/compiler-cli": "7.1.2", 39 | "@angular/language-service": "7.1.2", 40 | "@types/jasmine": "2.8.6", 41 | "@types/jasminewd2": "2.0.3", 42 | "@types/node": "8.9.4", 43 | "codelyzer": "4.5.0", 44 | "jasmine-core": "2.99.1", 45 | "jasmine-spec-reporter": "4.2.1", 46 | "karma": "3.1.3", 47 | "karma-chrome-launcher": "2.2.0", 48 | "karma-coverage-istanbul-reporter": "2.0.1", 49 | "karma-jasmine": "1.1.2", 50 | "karma-jasmine-html-reporter": "0.2.2", 51 | "protractor": "5.4.0", 52 | "ts-node": "7.0.1", 53 | "tslint": "5.11.0", 54 | "typescript": "3.1.6" 55 | }, 56 | "repository": {} 57 | } 58 | -------------------------------------------------------------------------------- /AngularUnitTesting/protractor.conf.js: -------------------------------------------------------------------------------- 1 | // Protractor configuration file, see link for more information 2 | // https://github.com/angular/protractor/blob/master/lib/config.ts 3 | 4 | const { SpecReporter } = require('jasmine-spec-reporter'); 5 | 6 | exports.config = { 7 | allScriptsTimeout: 11000, 8 | specs: [ 9 | './e2e/**/*.e2e-spec.ts' 10 | ], 11 | capabilities: { 12 | 'browserName': 'chrome', 13 | // For Travis CI only 14 | chromeOptions: { 15 | binary: process.env.CHROME_BIN, 16 | args: ['--no-sandbox'] 17 | } 18 | }, 19 | directConnect: true, 20 | baseUrl: 'http://localhost:4200/', 21 | framework: 'jasmine', 22 | jasmineNodeOpts: { 23 | showColors: true, 24 | defaultTimeoutInterval: 30000, 25 | print: function() {} 26 | }, 27 | onPrepare() { 28 | require('ts-node').register({ 29 | project: 'e2e/tsconfig.e2e.json' 30 | }); 31 | jasmine.getEnv().addReporter(new SpecReporter({ spec: { displayStacktrace: true } })); 32 | } 33 | }; 34 | -------------------------------------------------------------------------------- /AngularUnitTesting/src/.DS_Store: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Aakashdeveloper/EDU_APR_ANG_MRNG/6dd4be6100bb82d97011392ac966f0126db01702/AngularUnitTesting/src/.DS_Store -------------------------------------------------------------------------------- /AngularUnitTesting/src/app/app-routing.module.ts: -------------------------------------------------------------------------------- 1 | import { NgModule } from '@angular/core'; 2 | import { RouterModule, Routes } from '@angular/router'; 3 | 4 | import { DashboardComponent } from './dashboard/dashboard.component'; 5 | import { HeroesComponent } from './heroes/heroes.component'; 6 | import { HeroDetailComponent } from './hero-detail/hero-detail.component'; 7 | 8 | const routes: Routes = [ 9 | { path: '', redirectTo: '/dashboard', pathMatch: 'full' }, 10 | { path: 'dashboard', component: DashboardComponent }, 11 | { path: 'detail/:id', component: HeroDetailComponent }, 12 | { path: 'heroes', component: HeroesComponent } 13 | ]; 14 | 15 | @NgModule({ 16 | imports: [ RouterModule.forRoot(routes) ], 17 | exports: [ RouterModule ] 18 | }) 19 | export class AppRoutingModule {} 20 | -------------------------------------------------------------------------------- /AngularUnitTesting/src/app/app.component.css: -------------------------------------------------------------------------------- 1 | /* AppComponent's private CSS styles */ 2 | h1 { 3 | font-size: 1.2em; 4 | color: #999; 5 | margin-bottom: 0; 6 | } 7 | h2 { 8 | font-size: 2em; 9 | margin-top: 0; 10 | padding-top: 0; 11 | } 12 | nav a { 13 | padding: 5px 10px; 14 | text-decoration: none; 15 | margin-top: 10px; 16 | display: inline-block; 17 | background-color: #eee; 18 | border-radius: 4px; 19 | } 20 | nav a:visited, a:link { 21 | color: #607D8B; 22 | } 23 | nav a:hover { 24 | color: #039be5; 25 | background-color: #CFD8DC; 26 | } 27 | nav a.active { 28 | color: #039be5; 29 | } 30 | -------------------------------------------------------------------------------- /AngularUnitTesting/src/app/app.component.html: -------------------------------------------------------------------------------- 1 |

{{title}}

2 | 6 | 7 | 8 | -------------------------------------------------------------------------------- /AngularUnitTesting/src/app/app.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-root', 5 | templateUrl: './app.component.html', 6 | styleUrls: ['./app.component.css'] 7 | }) 8 | export class AppComponent { 9 | title = 'Tour of Heroes'; 10 | } 11 | -------------------------------------------------------------------------------- /AngularUnitTesting/src/app/app.module.ts: -------------------------------------------------------------------------------- 1 | import { NgModule } from '@angular/core'; 2 | import { BrowserModule } from '@angular/platform-browser'; 3 | import { FormsModule } from '@angular/forms'; 4 | import { HttpClientModule } from '@angular/common/http'; 5 | 6 | import { HttpClientInMemoryWebApiModule } from 'angular-in-memory-web-api'; 7 | import { InMemoryDataService } from './in-memory-data.service'; 8 | 9 | import { AppRoutingModule } from './app-routing.module'; 10 | 11 | import { AppComponent } from './app.component'; 12 | import { DashboardComponent } from './dashboard/dashboard.component'; 13 | import { HeroDetailComponent } from './hero-detail/hero-detail.component'; 14 | import { HeroesComponent } from './heroes/heroes.component'; 15 | import { HeroSearchComponent } from './hero-search/hero-search.component'; 16 | import { HeroService } from './hero.service'; 17 | import { MessageService } from './message.service'; 18 | import { MessagesComponent } from './messages/messages.component'; 19 | import { StrengthPipe } from './strength/strength.pipe'; 20 | import { HeroComponent } from './hero/hero.component'; 21 | 22 | @NgModule({ 23 | imports: [ 24 | BrowserModule, 25 | FormsModule, 26 | AppRoutingModule, 27 | HttpClientModule, 28 | 29 | // The HttpClientInMemoryWebApiModule module intercepts HTTP requests 30 | // and returns simulated server responses. 31 | // Remove it when a real server is ready to receive requests. 32 | HttpClientInMemoryWebApiModule.forRoot( 33 | InMemoryDataService, { dataEncapsulation: false } 34 | ) 35 | ], 36 | declarations: [ 37 | AppComponent, 38 | DashboardComponent, 39 | HeroesComponent, 40 | HeroDetailComponent, 41 | MessagesComponent, 42 | HeroSearchComponent, 43 | StrengthPipe, 44 | HeroComponent 45 | ], 46 | providers: [ HeroService, MessageService ], 47 | bootstrap: [ AppComponent ] 48 | }) 49 | export class AppModule { } 50 | -------------------------------------------------------------------------------- /AngularUnitTesting/src/app/dashboard/dashboard.component.css: -------------------------------------------------------------------------------- 1 | /* DashboardComponent's private CSS styles */ 2 | [class*='col-'] { 3 | float: left; 4 | padding-right: 20px; 5 | padding-bottom: 20px; 6 | } 7 | [class*='col-']:last-of-type { 8 | padding-right: 0; 9 | } 10 | a { 11 | text-decoration: none; 12 | } 13 | *, *:after, *:before { 14 | -webkit-box-sizing: border-box; 15 | -moz-box-sizing: border-box; 16 | box-sizing: border-box; 17 | } 18 | h3 { 19 | text-align: center; margin-bottom: 0; 20 | } 21 | h4 { 22 | position: relative; 23 | } 24 | .grid { 25 | margin: 0; 26 | } 27 | .col-1-4 { 28 | width: 25%; 29 | } 30 | .module { 31 | padding: 20px; 32 | text-align: center; 33 | color: #eee; 34 | max-height: 120px; 35 | min-width: 120px; 36 | background-color: #607D8B; 37 | border-radius: 2px; 38 | } 39 | .module:hover { 40 | background-color: #EEE; 41 | cursor: pointer; 42 | color: #607d8b; 43 | } 44 | .grid-pad { 45 | padding: 10px 0; 46 | } 47 | .grid-pad > [class*='col-']:last-of-type { 48 | padding-right: 20px; 49 | } 50 | @media (max-width: 600px) { 51 | .module { 52 | font-size: 10px; 53 | max-height: 75px; } 54 | } 55 | @media (max-width: 1024px) { 56 | .grid { 57 | margin: 0; 58 | } 59 | .module { 60 | min-width: 60px; 61 | } 62 | } 63 | -------------------------------------------------------------------------------- /AngularUnitTesting/src/app/dashboard/dashboard.component.html: -------------------------------------------------------------------------------- 1 |

Top Heroes

2 |
3 | 5 |
6 |

{{hero.name}}

7 |

Power: {{hero.strength | strength}} 8 |

9 |
10 |
11 | 12 | 13 | -------------------------------------------------------------------------------- /AngularUnitTesting/src/app/dashboard/dashboard.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { Hero } from '../hero'; 3 | import { HeroService } from '../hero.service'; 4 | 5 | @Component({ 6 | selector: 'app-dashboard', 7 | templateUrl: './dashboard.component.html', 8 | styleUrls: [ './dashboard.component.css' ] 9 | }) 10 | export class DashboardComponent implements OnInit { 11 | heroes: Hero[] = []; 12 | 13 | constructor(private heroService: HeroService) { } 14 | 15 | ngOnInit() { 16 | this.getHeroes(); 17 | } 18 | 19 | getHeroes(): void { 20 | this.heroService.getHeroes() 21 | .subscribe(heroes => this.heroes = heroes.slice(1, 5)); 22 | } 23 | } 24 | -------------------------------------------------------------------------------- /AngularUnitTesting/src/app/first.spec.ts: -------------------------------------------------------------------------------- 1 | describe('my first test', () => { 2 | let out; 3 | 4 | beforeEach(() => { 5 | out = {}; 6 | }); 7 | it('should be true if out is true', () => { 8 | // arrange 9 | out.a = false; 10 | 11 | // act 12 | out.a = true; 13 | 14 | // assert 15 | expect(out.a).toBe(true); 16 | }); 17 | 18 | }); 19 | 20 | -------------------------------------------------------------------------------- /AngularUnitTesting/src/app/hero-detail/hero-detail.component.css: -------------------------------------------------------------------------------- 1 | /* HeroDetailComponent's private CSS styles */ 2 | label { 3 | display: inline-block; 4 | width: 3em; 5 | margin: .5em 0; 6 | color: #607D8B; 7 | font-weight: bold; 8 | } 9 | input { 10 | height: 2em; 11 | font-size: 1em; 12 | padding-left: .4em; 13 | } 14 | button { 15 | margin-top: 20px; 16 | font-family: Arial; 17 | background-color: #eee; 18 | border: none; 19 | padding: 5px 10px; 20 | border-radius: 4px; 21 | cursor: pointer; cursor: hand; 22 | } 23 | button:hover { 24 | background-color: #cfd8dc; 25 | } 26 | button:disabled { 27 | background-color: #eee; 28 | color: #ccc; 29 | cursor: auto; 30 | } 31 | -------------------------------------------------------------------------------- /AngularUnitTesting/src/app/hero-detail/hero-detail.component.html: -------------------------------------------------------------------------------- 1 |
2 |

{{ hero.name | uppercase }} Details

3 |
id: {{hero.id}}
4 |
5 | 8 |
9 | 10 | 11 |
12 | -------------------------------------------------------------------------------- /AngularUnitTesting/src/app/hero-detail/hero-detail.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit, Input } from '@angular/core'; 2 | import { ActivatedRoute } from '@angular/router'; 3 | import { Location } from '@angular/common'; 4 | 5 | import { Hero } from '../hero'; 6 | import { HeroService } from '../hero.service'; 7 | 8 | @Component({ 9 | selector: 'app-hero-detail', 10 | templateUrl: './hero-detail.component.html', 11 | styleUrls: [ './hero-detail.component.css' ] 12 | }) 13 | export class HeroDetailComponent implements OnInit { 14 | @Input() hero: Hero; 15 | 16 | constructor( 17 | private route: ActivatedRoute, 18 | private heroService: HeroService, 19 | private location: Location 20 | ) {} 21 | 22 | ngOnInit(): void { 23 | this.getHero(); 24 | } 25 | 26 | getHero(): void { 27 | const id = +this.route.snapshot.paramMap.get('id'); 28 | this.heroService.getHero(id) 29 | .subscribe(hero => this.hero = hero); 30 | } 31 | 32 | goBack(): void { 33 | this.location.back(); 34 | } 35 | 36 | save(): void { 37 | this.heroService.updateHero(this.hero) 38 | .subscribe(() => this.goBack()); 39 | } 40 | } 41 | -------------------------------------------------------------------------------- /AngularUnitTesting/src/app/hero-search/hero-search.component.css: -------------------------------------------------------------------------------- 1 | /* HeroSearch private styles */ 2 | .search-result li { 3 | border-bottom: 1px solid gray; 4 | border-left: 1px solid gray; 5 | border-right: 1px solid gray; 6 | width:195px; 7 | height: 16px; 8 | padding: 5px; 9 | background-color: white; 10 | cursor: pointer; 11 | list-style-type: none; 12 | } 13 | 14 | .search-result li:hover { 15 | background-color: #607D8B; 16 | } 17 | 18 | .search-result li a { 19 | color: #888; 20 | display: block; 21 | text-decoration: none; 22 | } 23 | 24 | .search-result li a:hover { 25 | color: white; 26 | } 27 | .search-result li a:active { 28 | color: white; 29 | } 30 | #search-box { 31 | width: 200px; 32 | height: 20px; 33 | } 34 | 35 | 36 | ul.search-result { 37 | margin-top: 0; 38 | padding-left: 0; 39 | } 40 | -------------------------------------------------------------------------------- /AngularUnitTesting/src/app/hero-search/hero-search.component.html: -------------------------------------------------------------------------------- 1 |
2 |

Hero Search

3 | 4 | 5 | 6 | 13 |
14 | -------------------------------------------------------------------------------- /AngularUnitTesting/src/app/hero-search/hero-search.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | 3 | import { Observable, Subject } from 'rxjs'; 4 | 5 | import { 6 | debounceTime, distinctUntilChanged, switchMap 7 | } from 'rxjs/operators'; 8 | 9 | import { Hero } from '../hero'; 10 | import { HeroService } from '../hero.service'; 11 | 12 | @Component({ 13 | selector: 'app-hero-search', 14 | templateUrl: './hero-search.component.html', 15 | styleUrls: [ './hero-search.component.css' ] 16 | }) 17 | export class HeroSearchComponent implements OnInit { 18 | heroes$: Observable; 19 | private searchTerms = new Subject(); 20 | 21 | constructor(private heroService: HeroService) {} 22 | 23 | // Push a search term into the observable stream. 24 | search(term: string): void { 25 | this.searchTerms.next(term); 26 | } 27 | 28 | ngOnInit(): void { 29 | this.heroes$ = this.searchTerms.pipe( 30 | // wait 300ms after each keystroke before considering the term 31 | debounceTime(300), 32 | 33 | // ignore new term if same as previous term 34 | distinctUntilChanged(), 35 | 36 | // switch to new search observable each time the term changes 37 | switchMap((term: string) => this.heroService.searchHeroes(term)), 38 | ); 39 | } 40 | } 41 | -------------------------------------------------------------------------------- /AngularUnitTesting/src/app/hero.service.ts: -------------------------------------------------------------------------------- 1 | import { Injectable } from '@angular/core'; 2 | import { HttpClient, HttpHeaders } from '@angular/common/http'; 3 | 4 | import { Observable, of } from 'rxjs'; 5 | import { catchError, map, tap } from 'rxjs/operators'; 6 | 7 | import { Hero } from './hero'; 8 | import { MessageService } from './message.service'; 9 | 10 | const httpOptions = { 11 | headers: new HttpHeaders({ 'Content-Type': 'application/json' }) 12 | }; 13 | 14 | @Injectable() 15 | export class HeroService { 16 | 17 | private heroesUrl = 'api/heroes'; // URL to web api 18 | 19 | constructor( 20 | private http: HttpClient, 21 | private messageService: MessageService) { } 22 | 23 | /** GET heroes from the server */ 24 | getHeroes (): Observable { 25 | return this.http.get(this.heroesUrl) 26 | .pipe( 27 | tap(heroes => this.log(`fetched heroes`)), 28 | catchError(this.handleError('getHeroes', [])) 29 | ); 30 | } 31 | 32 | /** GET hero by id. Return `undefined` when id not found */ 33 | getHeroNo404(id: number): Observable { 34 | const url = `${this.heroesUrl}/?id=${id}`; 35 | return this.http.get(url) 36 | .pipe( 37 | map(heroes => heroes[0]), // returns a {0|1} element array 38 | tap(h => { 39 | const outcome = h ? `fetched` : `did not find`; 40 | this.log(`${outcome} hero id=${id}`); 41 | }), 42 | catchError(this.handleError(`getHero id=${id}`)) 43 | ); 44 | } 45 | 46 | /** GET hero by id. Will 404 if id not found */ 47 | getHero(id: number): Observable { 48 | const url = `${this.heroesUrl}/${id}`; 49 | return this.http.get(url).pipe( 50 | tap(_ => this.log(`fetched hero id=${id}`)), 51 | catchError(this.handleError(`getHero id=${id}`)) 52 | ); 53 | } 54 | 55 | /* GET heroes whose name contains search term */ 56 | searchHeroes(term: string): Observable { 57 | if (!term.trim()) { 58 | // if not search term, return empty hero array. 59 | return of([]); 60 | } 61 | return this.http.get(`api/heroes/?name=${term}`).pipe( 62 | tap(_ => this.log(`found heroes matching "${term}"`)), 63 | catchError(this.handleError('searchHeroes', [])) 64 | ); 65 | } 66 | 67 | //////// Save methods ////////// 68 | 69 | /** POST: add a new hero to the server */ 70 | addHero (hero: Hero): Observable { 71 | return this.http.post(this.heroesUrl, hero, httpOptions).pipe( 72 | tap((hero: Hero) => this.log(`added hero w/ id=${hero.id}`)), 73 | catchError(this.handleError('addHero')) 74 | ); 75 | } 76 | 77 | /** DELETE: delete the hero from the server */ 78 | deleteHero (hero: Hero | number): Observable { 79 | const id = typeof hero === 'number' ? hero : hero.id; 80 | const url = `${this.heroesUrl}/${id}`; 81 | 82 | return this.http.delete(url, httpOptions).pipe( 83 | tap(_ => this.log(`deleted hero id=${id}`)), 84 | catchError(this.handleError('deleteHero')) 85 | ); 86 | } 87 | 88 | /** PUT: update the hero on the server */ 89 | updateHero (hero: Hero): Observable { 90 | return this.http.put(this.heroesUrl, hero, httpOptions).pipe( 91 | tap(_ => this.log(`updated hero id=${hero.id}`)), 92 | catchError(this.handleError('updateHero')) 93 | ); 94 | } 95 | 96 | /** 97 | * Handle Http operation that failed. 98 | * Let the app continue. 99 | * @param operation - name of the operation that failed 100 | * @param result - optional value to return as the observable result 101 | */ 102 | private handleError (operation = 'operation', result?: T) { 103 | return (error: any): Observable => { 104 | 105 | // TODO: send the error to remote logging infrastructure 106 | console.error(error); // log to console instead 107 | 108 | // TODO: better job of transforming error for user consumption 109 | this.log(`${operation} failed: ${error.message}`); 110 | 111 | // Let the app keep running by returning an empty result. 112 | return of(result as T); 113 | }; 114 | } 115 | 116 | /** Log a HeroService message with the MessageService */ 117 | private log(message: string) { 118 | this.messageService.add('HeroService: ' + message); 119 | } 120 | } 121 | -------------------------------------------------------------------------------- /AngularUnitTesting/src/app/hero.ts: -------------------------------------------------------------------------------- 1 | export class Hero { 2 | id: number; 3 | name: string; 4 | strength: number; 5 | } 6 | -------------------------------------------------------------------------------- /AngularUnitTesting/src/app/hero/hero.component.css: -------------------------------------------------------------------------------- 1 | /* HeroComponent's private CSS styles */ 2 | 3 | a { 4 | color: #888; 5 | text-decoration: none; 6 | position: relative; 7 | display: block; 8 | width: 250px; 9 | } 10 | 11 | a:hover { 12 | color:#607D8B; 13 | } 14 | 15 | .badge { 16 | display: inline-block; 17 | font-size: small; 18 | color: white; 19 | padding: 0.8em 0.7em 0 0.7em; 20 | background-color: #607D8B; 21 | line-height: 1em; 22 | position: relative; 23 | left: -1px; 24 | top: -4px; 25 | height: 1.8em; 26 | min-width: 16px; 27 | text-align: right; 28 | margin-right: .8em; 29 | border-radius: 4px 0 0 4px; 30 | } 31 | 32 | button { 33 | background-color: #eee; 34 | border: none; 35 | padding: 5px 10px; 36 | border-radius: 4px; 37 | cursor: pointer; 38 | cursor: hand; 39 | font-family: Arial; 40 | } 41 | 42 | button:hover { 43 | background-color: #cfd8dc; 44 | } 45 | 46 | button.delete { 47 | position: relative; 48 | left: 194px; 49 | top: -32px; 50 | background-color: gray !important; 51 | color: white; 52 | } 53 | 54 | -------------------------------------------------------------------------------- /AngularUnitTesting/src/app/hero/hero.component.html: -------------------------------------------------------------------------------- 1 | 2 | {{hero.id}} {{hero.name}} 3 | 4 | -------------------------------------------------------------------------------- /AngularUnitTesting/src/app/hero/hero.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, Input, Output, EventEmitter } from '@angular/core'; 2 | import { Hero } from '../hero'; 3 | 4 | @Component({ 5 | selector: 'app-hero', 6 | templateUrl: './hero.component.html', 7 | styleUrls: ['./hero.component.css'] 8 | }) 9 | export class HeroComponent { 10 | @Input() hero: Hero; 11 | @Output() delete = new EventEmitter(); 12 | 13 | onDeleteClick($event): void { 14 | $event.stopPropagation(); 15 | this.delete.next(); 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /AngularUnitTesting/src/app/heroes/heroes.component.css: -------------------------------------------------------------------------------- 1 | /* HeroesComponent's private CSS styles */ 2 | .heroes { 3 | margin: 0 0 2em 0; 4 | list-style-type: none; 5 | padding: 0; 6 | width: 15em; 7 | } 8 | .heroes li { 9 | position: relative; 10 | cursor: pointer; 11 | background-color: #EEE; 12 | margin: .5em; 13 | padding: .3em 0; 14 | height: 1.6em; 15 | border-radius: 4px; 16 | } 17 | 18 | .heroes li:hover { 19 | color: #607D8B; 20 | background-color: #DDD; 21 | left: .1em; 22 | } 23 | 24 | -------------------------------------------------------------------------------- /AngularUnitTesting/src/app/heroes/heroes.component.html: -------------------------------------------------------------------------------- 1 |

My Heroes

2 | 3 |
4 | 7 | 8 | 11 |
12 | 13 |
    14 |
  • 15 | 16 |
  • 17 |
18 | -------------------------------------------------------------------------------- /AngularUnitTesting/src/app/heroes/heroes.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | 3 | import { Hero } from '../hero'; 4 | import { HeroService } from '../hero.service'; 5 | 6 | @Component({ 7 | selector: 'app-heroes', 8 | templateUrl: './heroes.component.html', 9 | styleUrls: ['./heroes.component.css'] 10 | }) 11 | export class HeroesComponent implements OnInit { 12 | heroes: Hero[]; 13 | 14 | constructor(private heroService: HeroService) { } 15 | 16 | ngOnInit() { 17 | this.getHeroes(); 18 | } 19 | 20 | getHeroes(): void { 21 | this.heroService.getHeroes() 22 | .subscribe(heroes => this.heroes = heroes); 23 | } 24 | 25 | add(name: string): void { 26 | name = name.trim(); 27 | var strength = 11 28 | if (!name) { return; } 29 | this.heroService.addHero({ name, strength } as Hero) 30 | .subscribe(hero => { 31 | this.heroes.push(hero); 32 | }); 33 | } 34 | 35 | delete(hero: Hero): void { 36 | this.heroes = this.heroes.filter(h => h !== hero); 37 | this.heroService.deleteHero(hero).subscribe(); 38 | } 39 | 40 | } 41 | -------------------------------------------------------------------------------- /AngularUnitTesting/src/app/in-memory-data.service.ts: -------------------------------------------------------------------------------- 1 | import { InMemoryDbService } from 'angular-in-memory-web-api'; 2 | 3 | export class InMemoryDataService implements InMemoryDbService { 4 | createDb() { 5 | const heroes = [ 6 | { id: 11, name: 'Mr. Nice', strength: 10 }, 7 | { id: 12, name: 'Narco', strength: 5 }, 8 | { id: 13, name: 'Bombasto', strength: 8 }, 9 | { id: 14, name: 'Celeritas', strength: 15 }, 10 | { id: 15, name: 'Magneta', strength: 22 }, 11 | { id: 16, name: 'RubberMan', strength: 50 }, 12 | { id: 17, name: 'Dynama', strength: 43 }, 13 | { id: 18, name: 'Dr IQ', strength: 4 }, 14 | { id: 19, name: 'Magma', strength: 18 }, 15 | { id: 20, name: 'Tornado', strength: 15 } 16 | ]; 17 | return {heroes}; 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /AngularUnitTesting/src/app/message.service.spec.ts: -------------------------------------------------------------------------------- 1 | import {MessageService} from './message.service'; 2 | 3 | describe('Message Service', () => { 4 | let service: MessageService; 5 | 6 | beforeEach(() => { 7 | service = new MessageService(); 8 | }); 9 | 10 | it('should have no message', () => { 11 | expect(service.messages.length).toBe(0); 12 | }); 13 | it('should add a message', () => { 14 | service.add('ok working'); 15 | service.add('ok working'); 16 | expect(service.messages.length).toBe(2); 17 | }); 18 | it('should remove message', () => { 19 | service.clear(); 20 | expect(service.messages.length).toBe(0); 21 | }); 22 | }); 23 | -------------------------------------------------------------------------------- /AngularUnitTesting/src/app/message.service.ts: -------------------------------------------------------------------------------- 1 | import { Injectable } from '@angular/core'; 2 | 3 | @Injectable() 4 | export class MessageService { 5 | messages: string[] = []; 6 | 7 | add(message: string) { 8 | this.messages.push(message); 9 | } 10 | 11 | clear() { 12 | this.messages = []; 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /AngularUnitTesting/src/app/messages/messages.component.css: -------------------------------------------------------------------------------- 1 | /* MessagesComponent's private CSS styles */ 2 | h2 { 3 | color: red; 4 | font-family: Arial, Helvetica, sans-serif; 5 | font-weight: lighter; 6 | } 7 | body { 8 | margin: 2em; 9 | } 10 | body, input[text], button { 11 | color: crimson; 12 | font-family: Cambria, Georgia; 13 | } 14 | 15 | button.clear { 16 | font-family: Arial; 17 | background-color: #eee; 18 | border: none; 19 | padding: 5px 10px; 20 | border-radius: 4px; 21 | cursor: pointer; 22 | cursor: hand; 23 | } 24 | button:hover { 25 | background-color: #cfd8dc; 26 | } 27 | button:disabled { 28 | background-color: #eee; 29 | color: #aaa; 30 | cursor: auto; 31 | } 32 | button.clear { 33 | color: #888; 34 | margin-bottom: 12px; 35 | } 36 | -------------------------------------------------------------------------------- /AngularUnitTesting/src/app/messages/messages.component.html: -------------------------------------------------------------------------------- 1 |
2 | 3 |

Messages

4 | 6 |
{{message}}
7 | 8 |
9 | -------------------------------------------------------------------------------- /AngularUnitTesting/src/app/messages/messages.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { MessageService } from '../message.service'; 3 | 4 | @Component({ 5 | selector: 'app-messages', 6 | templateUrl: './messages.component.html', 7 | styleUrls: ['./messages.component.css'] 8 | }) 9 | export class MessagesComponent implements OnInit { 10 | 11 | constructor(public messageService: MessageService) {} 12 | 13 | ngOnInit() { 14 | } 15 | 16 | } 17 | -------------------------------------------------------------------------------- /AngularUnitTesting/src/app/strength/strength.pipe.spec.ts: -------------------------------------------------------------------------------- 1 | import { StrengthPipe} from './strength.pipe'; 2 | 3 | describe('strengthPipe', () => { 4 | it('should display weak if strength is 5', () => { 5 | let pipe = new StrengthPipe(); 6 | 7 | expect(pipe.transform(5)).toEqual('5 (weak)'); 8 | }); 9 | it('should display strong if strength is 10 ', () => { 10 | let pipe = new StrengthPipe(); 11 | 12 | expect(pipe.transform(10)).toEqual('10 (strong)'); 13 | }); 14 | it('should display unbelievable if strength is 21 ', () => { 15 | let pipe = new StrengthPipe(); 16 | 17 | expect(pipe.transform(21)).toEqual('21 (unbelievable)'); 18 | }); 19 | }); -------------------------------------------------------------------------------- /AngularUnitTesting/src/app/strength/strength.pipe.ts: -------------------------------------------------------------------------------- 1 | import { Pipe, PipeTransform } from '@angular/core'; 2 | 3 | @Pipe({ 4 | name: 'strength' 5 | }) 6 | export class StrengthPipe implements PipeTransform { 7 | transform(value: number): string { 8 | if(value < 10) { 9 | return value + " (weak)"; 10 | } else if(value >= 10 && value < 20) { 11 | return value + " (strong)"; 12 | } else { 13 | return value + " (unbelievable)"; 14 | } 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /AngularUnitTesting/src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true 3 | }; 4 | -------------------------------------------------------------------------------- /AngularUnitTesting/src/environments/environment.ts: -------------------------------------------------------------------------------- 1 | // The file contents for the current environment will overwrite these during build. 2 | // The build system defaults to the dev environment which uses `environment.ts`, but if you do 3 | // `ng build --env=prod` then `environment.prod.ts` will be used instead. 4 | // The list of which env maps to which file can be found in `.angular-cli.json`. 5 | 6 | export const environment = { 7 | production: false 8 | }; 9 | -------------------------------------------------------------------------------- /AngularUnitTesting/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Tour of Heroes 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /AngularUnitTesting/src/karma.conf.js: -------------------------------------------------------------------------------- 1 | // Karma configuration file, see link for more information 2 | // https://karma-runner.github.io/1.0/config/configuration-file.html 3 | 4 | module.exports = function (config) { 5 | config.set({ 6 | basePath: '', 7 | frameworks: ['jasmine', '@angular-devkit/build-angular'], 8 | plugins: [ 9 | require('karma-jasmine'), 10 | require('karma-chrome-launcher'), 11 | require('karma-jasmine-html-reporter'), 12 | require('karma-coverage-istanbul-reporter'), 13 | require('@angular-devkit/build-angular/plugins/karma') 14 | ], 15 | client: { 16 | clearContext: false // leave Jasmine Spec Runner output visible in browser 17 | }, 18 | coverageIstanbulReporter: { 19 | dir: require('path').join(__dirname, '../coverage'), 20 | reports: ['html', 'lcovonly'], 21 | fixWebpackSourcePaths: true 22 | }, 23 | reporters: ['progress', 'kjhtml'], 24 | port: 9876, 25 | colors: true, 26 | logLevel: config.LOG_INFO, 27 | autoWatch: true, 28 | browsers: ['Chrome'], 29 | singleRun: false 30 | }); 31 | }; -------------------------------------------------------------------------------- /AngularUnitTesting/src/main.ts: -------------------------------------------------------------------------------- 1 | import { enableProdMode } from '@angular/core'; 2 | import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; 3 | 4 | import { AppModule } from './app/app.module'; 5 | import { environment } from './environments/environment'; 6 | 7 | if (environment.production) { 8 | enableProdMode(); 9 | } 10 | 11 | platformBrowserDynamic().bootstrapModule(AppModule); 12 | -------------------------------------------------------------------------------- /AngularUnitTesting/src/polyfills.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * This file includes polyfills needed by Angular and is loaded before the app. 3 | * You can add your own extra polyfills to this file. 4 | * 5 | * This file is divided into 2 sections: 6 | * 1. Browser polyfills. These are applied before loading ZoneJS and are sorted by browsers. 7 | * 2. Application imports. Files imported after ZoneJS that should be loaded before your main 8 | * file. 9 | * 10 | * The current setup is for so-called "evergreen" browsers; the last versions of browsers that 11 | * automatically update themselves. This includes Safari >= 10, Chrome >= 55 (including Opera), 12 | * Edge >= 13 on the desktop, and iOS 10 and Chrome on mobile. 13 | * 14 | * Learn more in https://angular.io/docs/ts/latest/guide/browser-support.html 15 | */ 16 | 17 | /*************************************************************************************************** 18 | * BROWSER POLYFILLS 19 | */ 20 | 21 | /** IE9, IE10 and IE11 requires all of the following polyfills. **/ 22 | // import 'core-js/es6/symbol'; 23 | // import 'core-js/es6/object'; 24 | // import 'core-js/es6/function'; 25 | // import 'core-js/es6/parse-int'; 26 | // import 'core-js/es6/parse-float'; 27 | // import 'core-js/es6/number'; 28 | // import 'core-js/es6/math'; 29 | // import 'core-js/es6/string'; 30 | // import 'core-js/es6/date'; 31 | // import 'core-js/es6/array'; 32 | // import 'core-js/es6/regexp'; 33 | // import 'core-js/es6/map'; 34 | // import 'core-js/es6/weak-map'; 35 | // import 'core-js/es6/set'; 36 | 37 | /** IE10 and IE11 requires the following for NgClass support on SVG elements */ 38 | // import 'classlist.js'; // Run `npm install --save classlist.js`. 39 | 40 | /** IE10 and IE11 requires the following for the Reflect API. */ 41 | // import 'core-js/es6/reflect'; 42 | 43 | 44 | /** Evergreen browsers require these. **/ 45 | // Used for reflect-metadata in JIT. If you use AOT (and only Angular decorators), you can remove. 46 | import 'core-js/es7/reflect'; 47 | 48 | 49 | /** 50 | * Required to support Web Animations `@angular/platform-browser/animations`. 51 | * Needed for: All but Chrome, Firefox and Opera. http://caniuse.com/#feat=web-animation 52 | **/ 53 | // import 'web-animations-js'; 54 | 55 | 56 | 57 | /*************************************************************************************************** 58 | * Zone JS is required by default for Angular itself. 59 | */ 60 | import 'zone.js/dist/zone'; // Included with Angular CLI. 61 | 62 | 63 | 64 | /*************************************************************************************************** 65 | * APPLICATION IMPORTS 66 | */ 67 | -------------------------------------------------------------------------------- /AngularUnitTesting/src/styles.css: -------------------------------------------------------------------------------- 1 | /* Master Styles */ 2 | h1 { 3 | color: #369; 4 | font-family: Arial, Helvetica, sans-serif; 5 | font-size: 250%; 6 | } 7 | h2, h3 { 8 | color: #444; 9 | font-family: Arial, Helvetica, sans-serif; 10 | font-weight: lighter; 11 | } 12 | body { 13 | margin: 2em; 14 | } 15 | body, input[text], button { 16 | color: #888; 17 | font-family: Cambria, Georgia; 18 | } 19 | a { 20 | cursor: pointer; 21 | cursor: hand; 22 | } 23 | button { 24 | font-family: Arial; 25 | background-color: #eee; 26 | border: none; 27 | padding: 5px 10px; 28 | border-radius: 4px; 29 | cursor: pointer; 30 | cursor: hand; 31 | } 32 | button:hover { 33 | background-color: #cfd8dc; 34 | } 35 | button:disabled { 36 | background-color: #eee; 37 | color: #aaa; 38 | cursor: auto; 39 | } 40 | 41 | /* Navigation link styles */ 42 | nav a { 43 | padding: 5px 10px; 44 | text-decoration: none; 45 | margin-right: 10px; 46 | margin-top: 10px; 47 | display: inline-block; 48 | background-color: #eee; 49 | border-radius: 4px; 50 | } 51 | nav a:visited, a:link { 52 | color: #607D8B; 53 | } 54 | nav a:hover { 55 | color: #039be5; 56 | background-color: #CFD8DC; 57 | } 58 | nav a.active { 59 | color: #039be5; 60 | } 61 | 62 | /* everywhere else */ 63 | * { 64 | font-family: Arial, Helvetica, sans-serif; 65 | } 66 | -------------------------------------------------------------------------------- /AngularUnitTesting/src/test.ts: -------------------------------------------------------------------------------- 1 | // This file is required by karma.conf.js and loads recursively all the .spec and framework files 2 | 3 | import 'zone.js/dist/long-stack-trace-zone'; 4 | import 'zone.js/dist/proxy.js'; 5 | import 'zone.js/dist/sync-test'; 6 | import 'zone.js/dist/jasmine-patch'; 7 | import 'zone.js/dist/async-test'; 8 | import 'zone.js/dist/fake-async-test'; 9 | import { getTestBed } from '@angular/core/testing'; 10 | import { 11 | BrowserDynamicTestingModule, 12 | platformBrowserDynamicTesting 13 | } from '@angular/platform-browser-dynamic/testing'; 14 | 15 | // Unfortunately there's no typing for the `__karma__` variable. Just declare it as any. 16 | declare const __karma__: any; 17 | declare const require: any; 18 | 19 | // Prevent Karma from running prematurely. 20 | __karma__.loaded = function () {}; 21 | 22 | // First, initialize the Angular testing environment. 23 | getTestBed().initTestEnvironment( 24 | BrowserDynamicTestingModule, 25 | platformBrowserDynamicTesting() 26 | ); 27 | // Then we find all the tests. 28 | const context = require.context('./', true, /\.spec\.ts$/); 29 | // And load the modules. 30 | context.keys().map(context); 31 | // Finally, start Karma to run the tests. 32 | __karma__.start(); 33 | -------------------------------------------------------------------------------- /AngularUnitTesting/src/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "baseUrl": "./", 6 | "module": "es2015", 7 | "types": [] 8 | }, 9 | "exclude": [ 10 | "test.ts", 11 | "**/*.spec.ts", 12 | "**/testing/*" 13 | ] 14 | } 15 | -------------------------------------------------------------------------------- /AngularUnitTesting/src/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/spec", 5 | "baseUrl": "./", 6 | "module": "commonjs", 7 | "target": "es5", 8 | "types": [ 9 | "jasmine", 10 | "node" 11 | ] 12 | }, 13 | "files": [ 14 | "test.ts", 15 | "polyfills.ts" 16 | ], 17 | "include": [ 18 | "**/*.spec.ts", 19 | "**/*.d.ts" 20 | ] 21 | } 22 | -------------------------------------------------------------------------------- /AngularUnitTesting/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compileOnSave": false, 3 | "compilerOptions": { 4 | "outDir": "./dist/out-tsc", 5 | "sourceMap": true, 6 | "declaration": false, 7 | "moduleResolution": "node", 8 | "emitDecoratorMetadata": true, 9 | "experimentalDecorators": true, 10 | "target": "es5", 11 | "typeRoots": [ 12 | "node_modules/@types" 13 | ], 14 | "lib": [ 15 | "es2017", 16 | "dom" 17 | ] 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /AngularUnitTesting/tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "rulesDirectory": [ 3 | "node_modules/codelyzer" 4 | ], 5 | "rules": { 6 | "arrow-return-shorthand": true, 7 | "callable-types": true, 8 | "class-name": true, 9 | "comment-format": [ 10 | true, 11 | "check-space" 12 | ], 13 | "curly": true, 14 | "deprecation": { 15 | "severity": "warn" 16 | }, 17 | "eofline": true, 18 | "forin": true, 19 | "import-blacklist": [ 20 | true, 21 | "rxjs", 22 | "rxjs/Rx" 23 | ], 24 | "import-spacing": true, 25 | "indent": [ 26 | true, 27 | "spaces" 28 | ], 29 | "interface-over-type-literal": true, 30 | "label-position": true, 31 | "max-line-length": [ 32 | true, 33 | 140 34 | ], 35 | "member-access": false, 36 | "member-ordering": [ 37 | true, 38 | { 39 | "order": [ 40 | "static-field", 41 | "instance-field", 42 | "static-method", 43 | "instance-method" 44 | ] 45 | } 46 | ], 47 | "no-arg": true, 48 | "no-bitwise": true, 49 | "no-console": [ 50 | true, 51 | "debug", 52 | "info", 53 | "time", 54 | "timeEnd", 55 | "trace" 56 | ], 57 | "no-construct": true, 58 | "no-debugger": true, 59 | "no-duplicate-super": true, 60 | "no-empty": false, 61 | "no-empty-interface": true, 62 | "no-eval": true, 63 | "no-inferrable-types": [ 64 | true, 65 | "ignore-params" 66 | ], 67 | "no-misused-new": true, 68 | "no-non-null-assertion": true, 69 | "no-shadowed-variable": true, 70 | "no-string-literal": false, 71 | "no-string-throw": true, 72 | "no-switch-case-fall-through": true, 73 | "no-trailing-whitespace": true, 74 | "no-unnecessary-initializer": true, 75 | "no-unused-expression": true, 76 | "no-use-before-declare": true, 77 | "no-var-keyword": true, 78 | "object-literal-sort-keys": false, 79 | "one-line": [ 80 | true, 81 | "check-open-brace", 82 | "check-catch", 83 | "check-else", 84 | "check-whitespace" 85 | ], 86 | "prefer-const": true, 87 | "quotemark": [ 88 | true, 89 | "single" 90 | ], 91 | "radix": true, 92 | "semicolon": [ 93 | true, 94 | "always" 95 | ], 96 | "triple-equals": [ 97 | true, 98 | "allow-null-check" 99 | ], 100 | "typedef-whitespace": [ 101 | true, 102 | { 103 | "call-signature": "nospace", 104 | "index-signature": "nospace", 105 | "parameter": "nospace", 106 | "property-declaration": "nospace", 107 | "variable-declaration": "nospace" 108 | } 109 | ], 110 | "typeof-compare": true, 111 | "unified-signatures": true, 112 | "variable-name": false, 113 | "whitespace": [ 114 | true, 115 | "check-branch", 116 | "check-decl", 117 | "check-operator", 118 | "check-separator", 119 | "check-type" 120 | ], 121 | "directive-selector": [ 122 | true, 123 | "attribute", 124 | "app", 125 | "camelCase" 126 | ], 127 | "component-selector": [ 128 | true, 129 | "element", 130 | "app", 131 | "kebab-case" 132 | ], 133 | "no-output-on-prefix": true, 134 | "use-input-property-decorator": true, 135 | "use-output-property-decorator": true, 136 | "use-host-property-decorator": true, 137 | "no-input-rename": true, 138 | "no-output-rename": true, 139 | "use-life-cycle-interface": true, 140 | "use-pipe-transform-interface": true, 141 | "component-class-suffix": true, 142 | "directive-class-suffix": true 143 | } 144 | } 145 | -------------------------------------------------------------------------------- /JWT/.DS_Store: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Aakashdeveloper/EDU_APR_ANG_MRNG/6dd4be6100bb82d97011392ac966f0126db01702/JWT/.DS_Store -------------------------------------------------------------------------------- /JWT/.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | .vscode 3 | npm-debug.log 4 | .serverless 5 | variables.env -------------------------------------------------------------------------------- /JWT/app.js: -------------------------------------------------------------------------------- 1 | var express = require('express'); 2 | var app = express(); 3 | var cors = require('cors') 4 | var db = require('./db'); 5 | 6 | app.use(cors()) 7 | var AuthController = require('./auth/AuthController'); 8 | app.use('/api/auth', AuthController); 9 | 10 | module.exports = app; -------------------------------------------------------------------------------- /JWT/auth/AuthController.js: -------------------------------------------------------------------------------- 1 | var express = require('express'); 2 | var router = express.Router(); 3 | var bodyParser = require('body-parser'); 4 | var jwt = require('jsonwebtoken'); 5 | var bcrypt = require('bcryptjs'); 6 | var config = require('../config'); 7 | 8 | router.use(bodyParser.urlencoded({ extended: false })); 9 | router.use(bodyParser.json()); 10 | var User = require('../user/User'); 11 | 12 | router.post('/register', function(req, res) { 13 | 14 | var hashedPassword = bcrypt.hashSync(req.body.password, 8); 15 | 16 | User.create({ 17 | name : req.body.name, 18 | email : req.body.email, 19 | password : hashedPassword, 20 | role:req.body.role?req.body.role:'user' 21 | }, 22 | function (err, user) { 23 | if (err) return res.status(500).send("There was a problem registering the user.") 24 | // create a token 25 | var token = jwt.sign({ id: user._id }, config.secret, { 26 | expiresIn: 86400 // expires in 24 hours 27 | }); 28 | res.setHeader('Access-Control-Allow-Origin','*') 29 | res.setHeader('Access-Control-Allow-Headers','Origin, X-Requested-With,Content-Type,Accept') 30 | res.status(200).send({ auth: true, token: token }); 31 | }); 32 | }); 33 | 34 | router.get('/userinfo', function(req, res) { 35 | var token = req.headers['x-access-token']; 36 | if (!token) return res.status(401).send({ auth: false, message: 'No token provided.' }); 37 | 38 | jwt.verify(token, config.secret, function(err, decoded) { 39 | if (err) return res.status(500).send({ auth: false, message: 'Failed to authenticate token.' }); 40 | 41 | // res.status(200).send(decoded); 42 | User.findById(decoded.id, { password: 0 }, function (err, user) { 43 | if (err) return res.status(500).send("There was a problem finding the user."); 44 | if (!user) return res.status(404).send("No user found."); 45 | res.setHeader('Access-Control-Allow-Origin','*') 46 | res.setHeader('Access-Control-Allow-Headers','Origin, X-Requested-With,Content-Type,Accept') 47 | res.status(200).send(user); 48 | }); 49 | }); 50 | }); 51 | 52 | router.post('/login', function(req, res) { 53 | User.findOne({ email: req.body.email }, function (err, user) { 54 | if (err) return res.status(500).send('Error on the server.'); 55 | if (!user) return res.status(404).send('No user found.'); 56 | var passwordIsValid = bcrypt.compareSync(req.body.password, user.password); 57 | if (!passwordIsValid) return res.status(401).send({ auth: false, token: null }); 58 | var token = jwt.sign({ id: user._id }, config.secret, { 59 | expiresIn: 86400 // expires in 24 hours 60 | }); 61 | res.setHeader('Access-Control-Allow-Origin','*') 62 | res.setHeader('Access-Control-Allow-Headers','Origin, X-Requested-With,Content-Type,Accept') 63 | res.status(200).send({ auth: true, token: token }); 64 | }); 65 | }); 66 | 67 | router.get('/users',(req,res) => { 68 | User.find({},(err,data)=>{ 69 | if(err)throw err; 70 | res.send(data) 71 | }) 72 | }) 73 | 74 | 75 | module.exports = router; -------------------------------------------------------------------------------- /JWT/config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | 'secret': 'supersecret' 3 | }; -------------------------------------------------------------------------------- /JWT/db.js: -------------------------------------------------------------------------------- 1 | var mongoose = require('mongoose'); 2 | mongoose.connect('mongodb://localhost:27017/aprang'); -------------------------------------------------------------------------------- /JWT/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "backendapi", 3 | "version": "1.0.0", 4 | "description": "", 5 | "main": "app.js", 6 | "scripts": { 7 | "start": "nodemon server.js", 8 | "test": "echo \"Error: no test specified\" && exit 1" 9 | }, 10 | "author": "", 11 | "license": "ISC", 12 | "dependencies": { 13 | "bcryptjs": "^2.4.3", 14 | "body-parser": "^1.18.2", 15 | "cors": "^2.8.5", 16 | "express": "^4.16.2", 17 | "jsonwebtoken": "^8.5.1", 18 | "mongoose": "^5.0.1" 19 | } 20 | } 21 | -------------------------------------------------------------------------------- /JWT/server.js: -------------------------------------------------------------------------------- 1 | var app = require('./app'); 2 | var port = process.env.PORT || 5000; 3 | 4 | app.listen(port, function() { 5 | console.log('Express server listening on port ' + port); 6 | }); -------------------------------------------------------------------------------- /JWT/user/User.js: -------------------------------------------------------------------------------- 1 | var mongoose = require('mongoose'); 2 | var UserSchema = new mongoose.Schema({ 3 | name: String, 4 | email: String, 5 | password: String, 6 | role: String 7 | }); 8 | mongoose.model('User', UserSchema); 9 | 10 | module.exports = mongoose.model('User'); -------------------------------------------------------------------------------- /data/artistsample.json: -------------------------------------------------------------------------------- 1 | { 2 | "artists": [ 3 | { 4 | "id": 1, 5 | "name": "Jimi Hendrix", 6 | "cover":"jimi_hendrix", 7 | "bio":"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.", 8 | "albums": [ 9 | {"albumId":"a1","title":"Electric Ladyland","year":1968,"cover":"electric-ladyland","price":20}, 10 | {"albumId":"a2","title":"Experience","year":1971,"cover":"experienced","price":25}, 11 | {"albumId":"a3","title":"Isle of Wright","year":1971,"cover":"isle_of_wright","price":15}, 12 | {"albumId":"a4","title":"Band of Gypsys","year":1970,"cover":"band_of_gypsys","price":10} 13 | ], 14 | "genre":"rock, blues" 15 | }, 16 | { 17 | "id": 2, 18 | "name": "Madonna", 19 | "cover":"madonna", 20 | "bio":"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.", 21 | "albums": [ 22 | {"albumId":"b1","title":"Like a Virgin","year":1984,"cover":"like_a_virgin","price":20}, 23 | {"albumId":"b2","title":"True Blue","year":1986,"cover":"true_blue","price":25}, 24 | {"albumId":"b3","title":"Erotica","year":1994,"cover":"erotica","price":15}, 25 | {"albumId":"b4","title":"Ray of Light","year":1998,"cover":"ray_of_light","price":10} 26 | ], 27 | "genre":"pop" 28 | }, 29 | { 30 | "id": 3, 31 | "name": "Johnny Cash", 32 | "cover":"johnny_cash", 33 | "bio":"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.", 34 | "albums": [ 35 | {"albumId":"c1","title":"Ain't No Grave","year":2010,"cover":"no_grave","price":20}, 36 | {"albumId":"c2","title":"Out Among the Stars","year":2014,"cover":"among_stars","price":25}, 37 | {"albumId":"c3","title":"Solitary Man","year":2000,"cover":"solitary_man","price":15}, 38 | {"albumId":"c4","title":"The Man Comes Around","year":2002,"cover":"man_comes_around","price":10} 39 | ], 40 | "genre":"pop" 41 | }, 42 | { 43 | "id": 4, 44 | "name": "Pink Floyd", 45 | "cover":"pink_floyd", 46 | "bio":"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.", 47 | "albums": [ 48 | {"albumId":"d1","title":"The Wall","year":1979,"cover":"the_wall","price":20}, 49 | {"albumId":"d2","title":"The Dark Side of the Moon","year":1973,"cover":"dark_side","price":25}, 50 | {"albumId":"d3","title":"Animals","year":1977,"cover":"animals","price":15} 51 | ], 52 | "genre":"Rock" 53 | } 54 | ], 55 | 56 | "orders":[ 57 | {"id":1, "name":"a"}, 58 | {"id":2, "name":"b"} 59 | ] 60 | } -------------------------------------------------------------------------------- /data/moviessample.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "_id": "5ab12612f36d2879268f284a", 4 | "name": "Black Panther", 5 | "language": "ENGLISH", 6 | "rate": 4.5, 7 | "type": "Action Adventure Fantasy", 8 | "imageUrl": "https://image.ibb.co/f0hhZc/bp.jpg" 9 | }, 10 | { 11 | "_id": "5ab12666f36d2879268f2902", 12 | "name": "Death Wish", 13 | "language": "ENGLISH", 14 | "type": "Action Crime Thriller", 15 | "rate": 3.2, 16 | "imageUrl": "https://image.ibb.co/gC9PfH/dw.jpg" 17 | }, 18 | { 19 | "_id": "5ab12678f36d2879268f291d", 20 | "name": "Coco", 21 | "language": "ENGLISH", 22 | "type": "Adventure Animation Family", 23 | "rate": 5, 24 | "imageUrl": "https://image.ibb.co/dQwWSx/coco.jpg" 25 | }, 26 | { 27 | "_id": "5ab126b6f36d2879268f2943", 28 | "name": "Avengers", 29 | "language": "ENGLISH", 30 | "type": "Actione", 31 | "rate": 2, 32 | "imageUrl": "https://www.hindustantimes.com/rf/image_size_960x540/HT/p2/2018/04/01/Pictures/_46a0b2c0-3590-11e8-8c5f-3c6cc031651e.jpg" 33 | }, 34 | { 35 | "_id": "5ab4e66b0c1d2b27846c6407", 36 | "name": "Black Friday", 37 | "language": "ENGLISH", 38 | "rate": 4.5, 39 | "type": "Action Adventure Fantasy", 40 | "imageUrl": "https://image.ibb.co/f0hhZc/bp.jpg" 41 | }, 42 | { 43 | "_id": "5ab12686f36d2879268f2930", 44 | "name": "Mission Impossible", 45 | "language": "English", 46 | "rate": 2.5, 47 | "type": "Horror Thriller", 48 | "imageUrl": "https://pre00.deviantart.net/5d3b/th/pre/f/2017/313/2/b/mission_impossible__dark_directive_teaser_poster_by_themadbutcher-dbt9wav.png" 49 | }, 50 | { 51 | "_id": "5ab12698f36d2879268f293e", 52 | "name": "Incredibles 2", 53 | "language": "ENGLISH", 54 | "type": "Animated", 55 | "rate": 4, 56 | "imageUrl": "http://static1.squarespace.com/static/588a4776f5e23132a09d23b2/588a4e91be65945e50a36c0e/5b24084baa4a999c88a9f277/1529088827756/tre.jpg" 57 | } 58 | ] -------------------------------------------------------------------------------- /firstapp/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see https://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /firstapp/.gitignore: -------------------------------------------------------------------------------- 1 | # See http://help.github.com/ignore-files/ for more about ignoring files. 2 | 3 | # compiled output 4 | /dist 5 | /tmp 6 | /out-tsc 7 | # Only exists if Bazel was run 8 | /bazel-out 9 | 10 | # dependencies 11 | /node_modules 12 | 13 | # profiling files 14 | chrome-profiler-events.json 15 | speed-measure-plugin.json 16 | 17 | # IDEs and editors 18 | /.idea 19 | .project 20 | .classpath 21 | .c9/ 22 | *.launch 23 | .settings/ 24 | *.sublime-workspace 25 | 26 | # IDE - VSCode 27 | .vscode/* 28 | !.vscode/settings.json 29 | !.vscode/tasks.json 30 | !.vscode/launch.json 31 | !.vscode/extensions.json 32 | .history/* 33 | 34 | # misc 35 | /.sass-cache 36 | /connect.lock 37 | /coverage 38 | /libpeerconnection.log 39 | npm-debug.log 40 | yarn-error.log 41 | testem.log 42 | /typings 43 | 44 | # System Files 45 | .DS_Store 46 | Thumbs.db 47 | -------------------------------------------------------------------------------- /firstapp/Dockerfile: -------------------------------------------------------------------------------- 1 | FROM node:alpine 2 | 3 | WORKDIR '/app' 4 | 5 | COPY package.json . 6 | RUN npm install 7 | COPY . . 8 | CMD ["npm", "start"] 9 | 10 | 11 | -------------------------------------------------------------------------------- /firstapp/README.md: -------------------------------------------------------------------------------- 1 | # Firstapp 2 | 3 | This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 7.3.6. 4 | 5 | ## Development server 6 | 7 | Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files. 8 | 9 | ## Code scaffolding 10 | 11 | Run `ng generate component component-name` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module`. 12 | 13 | ## Build 14 | 15 | Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory. Use the `--prod` flag for a production build. 16 | 17 | ## Running unit tests 18 | 19 | Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io). 20 | 21 | ## Running end-to-end tests 22 | 23 | Run `ng e2e` to execute the end-to-end tests via [Protractor](http://www.protractortest.org/). 24 | 25 | ## Further help 26 | 27 | To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI README](https://github.com/angular/angular-cli/blob/master/README.md). 28 | -------------------------------------------------------------------------------- /firstapp/angular.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "./node_modules/@angular/cli/lib/config/schema.json", 3 | "version": 1, 4 | "newProjectRoot": "projects", 5 | "projects": { 6 | "firstapp": { 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/firstapp", 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 | "es5BrowserSupport": true 31 | }, 32 | "configurations": { 33 | "production": { 34 | "fileReplacements": [ 35 | { 36 | "replace": "src/environments/environment.ts", 37 | "with": "src/environments/environment.prod.ts" 38 | } 39 | ], 40 | "optimization": true, 41 | "outputHashing": "all", 42 | "sourceMap": false, 43 | "extractCss": true, 44 | "namedChunks": false, 45 | "aot": true, 46 | "extractLicenses": true, 47 | "vendorChunk": false, 48 | "buildOptimizer": true, 49 | "budgets": [ 50 | { 51 | "type": "initial", 52 | "maximumWarning": "2mb", 53 | "maximumError": "5mb" 54 | } 55 | ] 56 | } 57 | } 58 | }, 59 | "serve": { 60 | "builder": "@angular-devkit/build-angular:dev-server", 61 | "options": { 62 | "browserTarget": "firstapp:build" 63 | }, 64 | "configurations": { 65 | "production": { 66 | "browserTarget": "firstapp:build:production" 67 | } 68 | } 69 | }, 70 | "extract-i18n": { 71 | "builder": "@angular-devkit/build-angular:extract-i18n", 72 | "options": { 73 | "browserTarget": "firstapp:build" 74 | } 75 | }, 76 | "test": { 77 | "builder": "@angular-devkit/build-angular:karma", 78 | "options": { 79 | "main": "src/test.ts", 80 | "polyfills": "src/polyfills.ts", 81 | "tsConfig": "src/tsconfig.spec.json", 82 | "karmaConfig": "src/karma.conf.js", 83 | "styles": [ 84 | "src/styles.css" 85 | ], 86 | "scripts": [], 87 | "assets": [ 88 | "src/favicon.ico", 89 | "src/assets" 90 | ] 91 | } 92 | }, 93 | "lint": { 94 | "builder": "@angular-devkit/build-angular:tslint", 95 | "options": { 96 | "tsConfig": [ 97 | "src/tsconfig.app.json", 98 | "src/tsconfig.spec.json" 99 | ], 100 | "exclude": [ 101 | "**/node_modules/**" 102 | ] 103 | } 104 | } 105 | } 106 | }, 107 | "firstapp-e2e": { 108 | "root": "e2e/", 109 | "projectType": "application", 110 | "prefix": "", 111 | "architect": { 112 | "e2e": { 113 | "builder": "@angular-devkit/build-angular:protractor", 114 | "options": { 115 | "protractorConfig": "e2e/protractor.conf.js", 116 | "devServerTarget": "firstapp:serve" 117 | }, 118 | "configurations": { 119 | "production": { 120 | "devServerTarget": "firstapp:serve:production" 121 | } 122 | } 123 | }, 124 | "lint": { 125 | "builder": "@angular-devkit/build-angular:tslint", 126 | "options": { 127 | "tsConfig": "e2e/tsconfig.e2e.json", 128 | "exclude": [ 129 | "**/node_modules/**" 130 | ] 131 | } 132 | } 133 | } 134 | } 135 | }, 136 | "defaultProject": "firstapp" 137 | } -------------------------------------------------------------------------------- /firstapp/e2e/protractor.conf.js: -------------------------------------------------------------------------------- 1 | // Protractor configuration file, see link for more information 2 | // https://github.com/angular/protractor/blob/master/lib/config.ts 3 | 4 | const { SpecReporter } = require('jasmine-spec-reporter'); 5 | 6 | exports.config = { 7 | allScriptsTimeout: 11000, 8 | specs: [ 9 | './src/**/*.e2e-spec.ts' 10 | ], 11 | capabilities: { 12 | 'browserName': 'chrome' 13 | }, 14 | directConnect: true, 15 | baseUrl: 'http://localhost:4200/', 16 | framework: 'jasmine', 17 | jasmineNodeOpts: { 18 | showColors: true, 19 | defaultTimeoutInterval: 30000, 20 | print: function() {} 21 | }, 22 | onPrepare() { 23 | require('ts-node').register({ 24 | project: require('path').join(__dirname, './tsconfig.e2e.json') 25 | }); 26 | jasmine.getEnv().addReporter(new SpecReporter({ spec: { displayStacktrace: true } })); 27 | } 28 | }; -------------------------------------------------------------------------------- /firstapp/e2e/src/app.e2e-spec.ts: -------------------------------------------------------------------------------- 1 | import { AppPage } from './app.po'; 2 | import { browser, logging } from 'protractor'; 3 | 4 | describe('workspace-project App', () => { 5 | let page: AppPage; 6 | 7 | beforeEach(() => { 8 | page = new AppPage(); 9 | }); 10 | 11 | it('should display welcome message', () => { 12 | page.navigateTo(); 13 | expect(page.getTitleText()).toEqual('Welcome to firstapp!'); 14 | }); 15 | 16 | afterEach(async () => { 17 | // Assert that there are no errors emitted from the browser 18 | const logs = await browser.manage().logs().get(logging.Type.BROWSER); 19 | expect(logs).not.toContain(jasmine.objectContaining({ 20 | level: logging.Level.SEVERE, 21 | } as logging.Entry)); 22 | }); 23 | }); 24 | -------------------------------------------------------------------------------- /firstapp/e2e/src/app.po.ts: -------------------------------------------------------------------------------- 1 | import { browser, by, element } from 'protractor'; 2 | 3 | export class AppPage { 4 | navigateTo() { 5 | return browser.get(browser.baseUrl) as Promise; 6 | } 7 | 8 | getTitleText() { 9 | return element(by.css('app-root h1')).getText() as Promise; 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /firstapp/e2e/tsconfig.e2e.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "module": "commonjs", 6 | "target": "es5", 7 | "types": [ 8 | "jasmine", 9 | "jasminewd2", 10 | "node" 11 | ] 12 | } 13 | } -------------------------------------------------------------------------------- /firstapp/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "firstapp", 3 | "version": "0.0.0", 4 | "scripts": { 5 | "ng": "ng", 6 | "start": "ng serve --port 8800", 7 | "build": "ng build", 8 | "test": "ng test", 9 | "lint": "ng lint", 10 | "e2e": "ng e2e" 11 | }, 12 | "private": true, 13 | "dependencies": { 14 | "@angular/animations": "~7.2.0", 15 | "@angular/common": "~7.2.0", 16 | "@angular/compiler": "~7.2.0", 17 | "@angular/core": "~7.2.0", 18 | "@angular/forms": "~7.2.0", 19 | "@angular/platform-browser": "~7.2.0", 20 | "@angular/platform-browser-dynamic": "~7.2.0", 21 | "@angular/router": "~7.2.0", 22 | "bootstrap": "^3.4.1", 23 | "core-js": "^2.5.4", 24 | "rxjs": "~6.3.3", 25 | "tslib": "^1.9.0", 26 | "zone.js": "~0.8.26" 27 | }, 28 | "devDependencies": { 29 | "@angular-devkit/build-angular": "~0.13.0", 30 | "@angular/cli": "~7.3.6", 31 | "@angular/compiler-cli": "~7.2.0", 32 | "@angular/language-service": "~7.2.0", 33 | "@types/node": "~8.9.4", 34 | "@types/jasmine": "~2.8.8", 35 | "@types/jasminewd2": "~2.0.3", 36 | "codelyzer": "~4.5.0", 37 | "jasmine-core": "~2.99.1", 38 | "jasmine-spec-reporter": "~4.2.1", 39 | "karma": "~4.0.0", 40 | "karma-chrome-launcher": "~2.2.0", 41 | "karma-coverage-istanbul-reporter": "~2.0.1", 42 | "karma-jasmine": "~1.1.2", 43 | "karma-jasmine-html-reporter": "^0.2.2", 44 | "protractor": "~5.4.0", 45 | "ts-node": "~7.0.0", 46 | "tslint": "~5.11.0", 47 | "typescript": "~3.2.2" 48 | } 49 | } 50 | -------------------------------------------------------------------------------- /firstapp/src/app/app.component.html: -------------------------------------------------------------------------------- 1 |
2 |
3 |
4 | 28 |
29 |
30 | 31 |
32 | 33 |
34 | © Edureka_Apr_Mrng 35 |
-------------------------------------------------------------------------------- /firstapp/src/app/app.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-main', 5 | // template: 6 | templateUrl: './app.component.html' 7 | }) 8 | 9 | export class AppComponent { 10 | 11 | } 12 | -------------------------------------------------------------------------------- /firstapp/src/app/app.module.ts: -------------------------------------------------------------------------------- 1 | // To import module file or anyother thing 2 | // that help to build file 3 | import { NgModule } from '@angular/core'; 4 | // To display app on browser 5 | import { BrowserModule } from '@angular/platform-browser'; 6 | // For forms Element 7 | import { FormsModule } from '@angular/Forms'; 8 | // For Http call 9 | import { HttpClientModule } from '@angular/common/http'; 10 | // For Routing 11 | import { RouterModule } from '@angular/router'; 12 | // Component 13 | import { AppComponent } from './app.component'; 14 | import { MoviesComponent } from './movies.component'; 15 | import { ProductComponent } from './products/product.component'; 16 | import { MyUpperPipe } from './products/myUpper.pipe'; 17 | import { DiscountPipe } from './products/myDiscount.pipe'; 18 | import { ProductSearchPipe } from './products/productFilter.pipe'; 19 | import { StarComponent } from './shared/star.component'; 20 | import { ProductService } from './products/product.service'; 21 | import { HomeComponent } from './home/home.component'; 22 | import { MusicComponent } from './music/music.component'; 23 | import { OrdersComponent } from './orders/orders.component'; 24 | import { NotFoundComponent } from './shared/notFound.component'; 25 | import { ProductDetailComponent } from './products/product-detail.component'; 26 | import { MusicService } from './music/music.service'; 27 | import { MusicModule } from './music/music.module'; 28 | import { ProductModule } from './products/product.module'; 29 | 30 | 31 | // decorater (matadata) 32 | @NgModule({ 33 | // All Module will declare here 34 | imports: [ 35 | BrowserModule, 36 | FormsModule, 37 | HttpClientModule, 38 | RouterModule.forRoot([ 39 | {path: 'products', component: ProductComponent}, 40 | {path: 'products/:id', component: ProductDetailComponent}, 41 | {path: 'orders', component: OrdersComponent }, 42 | {path: 'music', component: MusicComponent }, 43 | {path: 'home', component: HomeComponent }, 44 | {path: '', redirectTo: 'home', pathMatch: 'full' }, 45 | {path: '**', component: NotFoundComponent }, 46 | ]), 47 | ProductModule, 48 | MusicModule 49 | ], 50 | 51 | // All Component and pipe 52 | declarations: [ 53 | AppComponent, 54 | MoviesComponent, 55 | ProductComponent, 56 | MyUpperPipe, 57 | DiscountPipe, 58 | ProductSearchPipe, 59 | StarComponent, 60 | HomeComponent, 61 | MusicComponent, 62 | OrdersComponent, 63 | NotFoundComponent, 64 | ProductDetailComponent 65 | ], 66 | 67 | // Only first/main component 68 | bootstrap: [ 69 | AppComponent 70 | ], 71 | 72 | // All Services will declare here 73 | providers: [ 74 | ProductService, 75 | MusicService 76 | ] 77 | }) 78 | 79 | 80 | // to export or expose to external env 81 | export class AppModule { 82 | 83 | } 84 | 85 | -------------------------------------------------------------------------------- /firstapp/src/app/home/home.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Aakashdeveloper/EDU_APR_ANG_MRNG/6dd4be6100bb82d97011392ac966f0126db01702/firstapp/src/app/home/home.component.css -------------------------------------------------------------------------------- /firstapp/src/app/home/home.component.html: -------------------------------------------------------------------------------- 1 |
2 |
3 | {{pageTitle}} 4 |
5 |
6 |
7 | 10 |
11 |
12 |
Developed by:
13 |

Aakash Handa

14 | 15 |
@aakashdeveloper
16 |
17 | www.aakashhanda.me 18 |
19 |
20 |
21 |
-------------------------------------------------------------------------------- /firstapp/src/app/home/home.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | templateUrl: './home.component.html', 5 | styleUrls: ['./home.component.css'] 6 | }) 7 | export class HomeComponent { 8 | pageTitle: string = 'Home Page'; 9 | 10 | } 11 | -------------------------------------------------------------------------------- /firstapp/src/app/movies.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-movies', 5 | template: `

THis is movies page

` 6 | }) 7 | 8 | export class MoviesComponent { 9 | 10 | } 11 | -------------------------------------------------------------------------------- /firstapp/src/app/music/music.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Aakashdeveloper/EDU_APR_ANG_MRNG/6dd4be6100bb82d97011392ac966f0126db01702/firstapp/src/app/music/music.component.css -------------------------------------------------------------------------------- /firstapp/src/app/music/music.component.html: -------------------------------------------------------------------------------- 1 |
2 |
3 | Music Component 4 |
5 |
6 |
7 |
8 | 12 | 13 | 34 | 35 |
36 |
37 |
38 | -------------------------------------------------------------------------------- /firstapp/src/app/music/music.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { MusicService } from './music.service'; 3 | 4 | @Component({ 5 | selector: 'app-music', 6 | templateUrl: './music.component.html', 7 | styleUrls: ['./music.component.css'] 8 | }) 9 | export class MusicComponent implements OnInit { 10 | 11 | musicData: any[]; 12 | 13 | constructor( private music: MusicService ) { } 14 | 15 | ngOnInit() { 16 | this.music.getArtist() 17 | .subscribe((data) => {this.musicData = data[0].artists}); 18 | } 19 | 20 | } 21 | -------------------------------------------------------------------------------- /firstapp/src/app/music/music.module.ts: -------------------------------------------------------------------------------- 1 | import { NgModule } from '@angular/core'; 2 | 3 | @NgModule({ 4 | imports: [], 5 | declarations: [], 6 | providers: [] 7 | }) 8 | 9 | export class MusicModule { 10 | 11 | } 12 | 13 | -------------------------------------------------------------------------------- /firstapp/src/app/music/music.service.ts: -------------------------------------------------------------------------------- 1 | import { Injectable } from '@angular/core'; 2 | import { Observable } from 'rxjs'; 3 | import { HttpClient } from '@angular/common/http'; 4 | 5 | @Injectable() 6 | 7 | export class MusicService { 8 | private musicUrl = 'https://ngmusicdb.herokuapp.com/api/getMusic'; 9 | 10 | constructor(private http: HttpClient) {} 11 | getArtist(): Observable { 12 | return this.http.get(this.musicUrl); 13 | } 14 | 15 | } 16 | -------------------------------------------------------------------------------- /firstapp/src/app/orders/orders.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Aakashdeveloper/EDU_APR_ANG_MRNG/6dd4be6100bb82d97011392ac966f0126db01702/firstapp/src/app/orders/orders.component.css -------------------------------------------------------------------------------- /firstapp/src/app/orders/orders.component.html: -------------------------------------------------------------------------------- 1 |
2 |
3 | Order Component 4 |
5 |
6 | Order Content Here 7 |
8 |
9 | -------------------------------------------------------------------------------- /firstapp/src/app/orders/orders.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-orders', 5 | templateUrl: './orders.component.html', 6 | styleUrls: ['./orders.component.css'] 7 | }) 8 | export class OrdersComponent implements OnInit { 9 | 10 | constructor() { } 11 | 12 | ngOnInit() { 13 | } 14 | 15 | } 16 | -------------------------------------------------------------------------------- /firstapp/src/app/products/myDiscount.pipe.ts: -------------------------------------------------------------------------------- 1 | import { Pipe, PipeTransform } from '@angular/core'; 2 | 3 | @Pipe({ 4 | name: 'discount' 5 | }) 6 | 7 | export class DiscountPipe implements PipeTransform { 8 | transform(value: number) { 9 | value = value - 2; 10 | return value; 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /firstapp/src/app/products/myUpper.pipe.ts: -------------------------------------------------------------------------------- 1 | import {Pipe, PipeTransform} from '@angular/core'; 2 | 3 | @Pipe({ 4 | name: 'myUpperText' 5 | }) 6 | 7 | export class MyUpperPipe implements PipeTransform { 8 | transform(value: string, kindof: string, uname: string) { 9 | if (kindof === 'upper') { 10 | value = value.toUpperCase(); 11 | } else { 12 | value = value.toLowerCase(); 13 | } 14 | return value; 15 | } 16 | } 17 | 18 | 19 | /* 20 | value = value.toUpperCase(); 21 | value = uname + '-' + value; 22 | */ 23 | -------------------------------------------------------------------------------- /firstapp/src/app/products/product-detail.component.html: -------------------------------------------------------------------------------- 1 |
2 |
3 | Product Detail Component 4 |
5 |
6 | Product Detail Content Here for {{id}} 7 |

{{details[0].productName}}

8 | 9 |

{{details[0].description}}

10 |
11 |
15 |
16 | -------------------------------------------------------------------------------- /firstapp/src/app/products/product-detail.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { Router, ActivatedRoute } from '@angular/router'; 3 | import { IProduct } from './product.model'; 4 | import { ProductService } from './product.service'; 5 | 6 | @Component({ 7 | templateUrl: './product-detail.component.html' 8 | }) 9 | 10 | export class ProductDetailComponent implements OnInit { 11 | 12 | id: number; 13 | details: IProduct[]; 14 | 15 | constructor(private router: Router, 16 | private route: ActivatedRoute, 17 | private prodService: ProductService ) {} 18 | 19 | onBack(): void { 20 | this.router.navigate(['/products']); 21 | } 22 | 23 | ngOnInit(): void { 24 | this.id = this.route.snapshot.params['id']; 25 | this.prodService.getProductDetails(this.id) 26 | .subscribe((data) => this.details = data); 27 | } 28 | } 29 | 30 | 31 | /* 32 | name: string; 33 | image: string; 34 | description: string; 35 | this.route.queryParams 36 | .subscribe((data) => { 37 | this.name = data['name']; 38 | this.image = data['img']; 39 | this.description = data['desc']; 40 | }); 41 | */ 42 | -------------------------------------------------------------------------------- /firstapp/src/app/products/product.component.css: -------------------------------------------------------------------------------- 1 | thead{ 2 | color:slateblue 3 | } 4 | h4{ 5 | color:violet 6 | } -------------------------------------------------------------------------------- /firstapp/src/app/products/product.component.html: -------------------------------------------------------------------------------- 1 |

3 | Server status is {{serverstatus}} 4 |

5 |
6 |
7 | {{mainHeading}} 8 |
9 |
10 |
11 |
12 | {{title}} 13 |
14 |
15 | 17 |
18 |
19 |
20 |
21 |

Number of product filtered on basis {{userText}}: 22 | {{ (products | productSearch:userText).length }} 23 |

24 |
25 |
26 | {{showImage}} 27 | 28 |
29 | 30 | 31 | 32 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 51 | 56 | 57 | 58 | 61 | 63 | 64 | 65 |
33 | 37 | NameCodeDatePriceStar Rating
48 | 50 | 52 | 53 | {{prod.productName | myUpperText:'lower':'aakash'}} 54 | 55 | {{prod.productCode | myUpperText:'upper'}}{{prod.releaseDate | date}} 59 | {{prod.price | discount | currency:'INR'}} 60 |
66 |
67 | 68 | 69 | 70 |
71 |
72 | 73 | 74 | -------------------------------------------------------------------------------- /firstapp/src/app/products/product.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { IProduct } from './product.model'; 3 | import { ProductService } from './product.service'; 4 | 5 | @Component({ 6 | templateUrl: './product.component.html', 7 | // styles: ['thead{color:teal}', 'h4{color:tomato}'] 8 | styleUrls: ['./product.component.css'], 9 | styles: [ 10 | `.online{ 11 | background-color:wheat 12 | }` 13 | ] 14 | }) 15 | 16 | export class ProductComponent implements OnInit { 17 | title: string = 'Product Filter'; 18 | mainHeading: string = '*****Products Page*****'; 19 | showTable: boolean = true; 20 | showImage: boolean = false; 21 | userText: string ; 22 | imageWidth: number = 100; 23 | serverstatus: string = 'offline'; 24 | 25 | constructor(private productService: ProductService ) { 26 | this.serverstatus = Math.random() > 0.5 ? 'Online' : 'Offline'; 27 | } 28 | products: IProduct[]; 29 | 30 | ngOnInit(): void { 31 | this.productService.getProducts() 32 | .subscribe((data) => this.products = data); 33 | } 34 | 35 | toggleImage(): void { 36 | this.showImage = !this.showImage; 37 | } 38 | 39 | getColor() { 40 | return this.serverstatus === 'Online' ? 'green' : 'red'; 41 | } 42 | 43 | onDataRecive(message: string): void { 44 | this.mainHeading = '*****Products Page*****' + message; 45 | } 46 | } 47 | -------------------------------------------------------------------------------- /firstapp/src/app/products/product.model.ts: -------------------------------------------------------------------------------- 1 | export interface IProduct { 2 | _id: string; 3 | productId: number; 4 | productName: string; 5 | productCode: string; 6 | releaseDate: string; 7 | description: string; 8 | price: number; 9 | starRating: number; 10 | imageUrl: string; 11 | } 12 | -------------------------------------------------------------------------------- /firstapp/src/app/products/product.module.ts: -------------------------------------------------------------------------------- 1 | import { NgModule } from '@angular/core'; 2 | 3 | @NgModule({ 4 | imports: [], 5 | declarations: [], 6 | providers: [] 7 | }) 8 | 9 | export class ProductModule { 10 | 11 | } 12 | -------------------------------------------------------------------------------- /firstapp/src/app/products/product.service.ts: -------------------------------------------------------------------------------- 1 | import { Injectable } from '@angular/core'; 2 | import { IProduct } from './product.model'; 3 | import { HttpClient } from '@angular/common/http'; 4 | import { Observable } from 'rxjs'; 5 | 6 | @Injectable() 7 | 8 | export class ProductService { 9 | 10 | private productUrl = 'https://ngproductsparam.herokuapp.com/api/getProductDetails'; 11 | 12 | constructor(private http: HttpClient) {} 13 | 14 | getProducts(): Observable { 15 | return this.http.get(this.productUrl); 16 | } 17 | 18 | getProductDetails(id): Observable { 19 | return this.http.get(`${this.productUrl}?productId=${id}`); 20 | } 21 | 22 | } 23 | -------------------------------------------------------------------------------- /firstapp/src/app/products/productFilter.pipe.ts: -------------------------------------------------------------------------------- 1 | import { Pipe, PipeTransform } from '@angular/core'; 2 | import { IProduct } from './product.model'; 3 | 4 | @Pipe({ 5 | name: 'productSearch' 6 | }) 7 | 8 | export class ProductSearchPipe implements PipeTransform { 9 | transform(value: IProduct[], userInput: string ) { 10 | // convert user input in lowercase 11 | userInput = userInput ? userInput.toLowerCase() : null; 12 | // return according to user input 13 | return userInput ? value.filter( (product) => 14 | ((product.productName.toLowerCase().indexOf(userInput) !== -1)) 15 | || (product.productCode.toLowerCase().indexOf(userInput) !== -1) 16 | ) : value; 17 | } 18 | } 19 | 20 | 21 | 22 | // ages.filter((aakash) => { return age>=18 }) 23 | -------------------------------------------------------------------------------- /firstapp/src/app/products/product_bk.component: -------------------------------------------------------------------------------- 1 |
2 |
3 | Products Page 4 |
5 |
6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 |
NameClass
JohnAngular
BillNodeJS
24 | 25 | 26 | 27 | 28 | 29 | 30 |
31 |
32 | 33 |
34 |
35 | 36 |
37 |
38 | 39 |
40 |
41 | 42 |
43 |
44 | 45 |
46 |
47 | 48 |
49 |
50 | 51 |
52 | 53 |
54 |
55 |
-------------------------------------------------------------------------------- /firstapp/src/app/shared/notFound.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | template: '

Not Found 404

' 5 | }) 6 | 7 | export class NotFoundComponent { 8 | 9 | } 10 | -------------------------------------------------------------------------------- /firstapp/src/app/shared/star.component.css: -------------------------------------------------------------------------------- 1 | .crop{ 2 | overflow: hidden; 3 | } -------------------------------------------------------------------------------- /firstapp/src/app/shared/star.component.html: -------------------------------------------------------------------------------- 1 |
3 |
4 | 5 | 6 | 7 | 8 | 9 |
10 |
11 | 12 | -------------------------------------------------------------------------------- /firstapp/src/app/shared/star.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnChanges, 2 | OnInit, Input, Output, EventEmitter 3 | } from '@angular/core'; 4 | 5 | @Component({ 6 | selector: 'app-star', 7 | templateUrl: './star.component.html', 8 | styleUrls: ['./star.component.css'] 9 | }) 10 | 11 | export class StarComponent implements OnChanges, OnInit { 12 | 13 | @Input() rating: number; 14 | @Output() ratingClicked: EventEmitter = new EventEmitter(); 15 | starWidth: number; 16 | // This is always called first 17 | constructor() { 18 | console.log('>>>>>inside constructor'); 19 | } 20 | // This event fires when it detect the change 21 | ngOnChanges() { 22 | console.log('>>>>>inside onchanges'); 23 | this.starWidth = this.rating * 86 / 5; 24 | } 25 | 26 | // This fires after onchanges 27 | ngOnInit() { 28 | console.log('>>>>>inside init'); 29 | } 30 | 31 | // This fires when you loose the context 32 | ngOnDestory() { 33 | console.log('>>>>>inside destroy'); 34 | } 35 | 36 | onStar(): void { 37 | this.ratingClicked.emit(`The rating clicked is ${this.rating}`); 38 | } 39 | 40 | } 41 | -------------------------------------------------------------------------------- /firstapp/src/assets/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Aakashdeveloper/EDU_APR_ANG_MRNG/6dd4be6100bb82d97011392ac966f0126db01702/firstapp/src/assets/.gitkeep -------------------------------------------------------------------------------- /firstapp/src/assets/loading.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Aakashdeveloper/EDU_APR_ANG_MRNG/6dd4be6100bb82d97011392ac966f0126db01702/firstapp/src/assets/loading.gif -------------------------------------------------------------------------------- /firstapp/src/browserslist: -------------------------------------------------------------------------------- 1 | # This file is currently used by autoprefixer to adjust CSS to support the below specified browsers 2 | # For additional information regarding the format and rule options, please see: 3 | # https://github.com/browserslist/browserslist#queries 4 | # 5 | # For IE 9-11 support, please remove 'not' from the last line of the file and adjust as needed 6 | 7 | > 0.5% 8 | last 2 versions 9 | Firefox ESR 10 | not dead 11 | not IE 9-11 -------------------------------------------------------------------------------- /firstapp/src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true 3 | }; 4 | -------------------------------------------------------------------------------- /firstapp/src/environments/environment.ts: -------------------------------------------------------------------------------- 1 | // This file can be replaced during build by using the `fileReplacements` array. 2 | // `ng build --prod` replaces `environment.ts` with `environment.prod.ts`. 3 | // The list of file replacements can be found in `angular.json`. 4 | 5 | export const environment = { 6 | production: false 7 | }; 8 | 9 | /* 10 | * For easier debugging in development mode, you can import the following file 11 | * to ignore zone related error stack frames such as `zone.run`, `zoneDelegate.invokeTask`. 12 | * 13 | * This import should be commented out in production mode because it will have a negative impact 14 | * on performance if an error is thrown. 15 | */ 16 | // import 'zone.js/dist/zone-error'; // Included with Angular CLI. 17 | -------------------------------------------------------------------------------- /firstapp/src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Aakashdeveloper/EDU_APR_ANG_MRNG/6dd4be6100bb82d97011392ac966f0126db01702/firstapp/src/favicon.ico -------------------------------------------------------------------------------- /firstapp/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Firstapp 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 |
17 | 18 | 19 | -------------------------------------------------------------------------------- /firstapp/src/karma.conf.js: -------------------------------------------------------------------------------- 1 | // Karma configuration file, see link for more information 2 | // https://karma-runner.github.io/1.0/config/configuration-file.html 3 | 4 | module.exports = function (config) { 5 | config.set({ 6 | basePath: '', 7 | frameworks: ['jasmine', '@angular-devkit/build-angular'], 8 | plugins: [ 9 | require('karma-jasmine'), 10 | require('karma-chrome-launcher'), 11 | require('karma-jasmine-html-reporter'), 12 | require('karma-coverage-istanbul-reporter'), 13 | require('@angular-devkit/build-angular/plugins/karma') 14 | ], 15 | client: { 16 | clearContext: false // leave Jasmine Spec Runner output visible in browser 17 | }, 18 | coverageIstanbulReporter: { 19 | dir: require('path').join(__dirname, '../coverage/firstapp'), 20 | reports: ['html', 'lcovonly', 'text-summary'], 21 | fixWebpackSourcePaths: true 22 | }, 23 | reporters: ['progress', 'kjhtml'], 24 | port: 9876, 25 | colors: true, 26 | logLevel: config.LOG_INFO, 27 | autoWatch: true, 28 | browsers: ['Chrome'], 29 | singleRun: false, 30 | restartOnFileChange: true 31 | }); 32 | }; 33 | -------------------------------------------------------------------------------- /firstapp/src/main.ts: -------------------------------------------------------------------------------- 1 | import { enableProdMode } from '@angular/core'; 2 | import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; 3 | 4 | import { AppModule } from './app/app.module'; 5 | import { environment } from './environments/environment'; 6 | 7 | if (environment.production) { 8 | enableProdMode(); 9 | } 10 | 11 | platformBrowserDynamic().bootstrapModule(AppModule) 12 | .catch(err => console.error(err)); 13 | -------------------------------------------------------------------------------- /firstapp/src/polyfills.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * This file includes polyfills needed by Angular and is loaded before the app. 3 | * You can add your own extra polyfills to this file. 4 | * 5 | * This file is divided into 2 sections: 6 | * 1. Browser polyfills. These are applied before loading ZoneJS and are sorted by browsers. 7 | * 2. Application imports. Files imported after ZoneJS that should be loaded before your main 8 | * file. 9 | * 10 | * The current setup is for so-called "evergreen" browsers; the last versions of browsers that 11 | * automatically update themselves. This includes Safari >= 10, Chrome >= 55 (including Opera), 12 | * Edge >= 13 on the desktop, and iOS 10 and Chrome on mobile. 13 | * 14 | * Learn more in https://angular.io/guide/browser-support 15 | */ 16 | 17 | /*************************************************************************************************** 18 | * BROWSER POLYFILLS 19 | */ 20 | 21 | /** IE10 and IE11 requires the following for NgClass support on SVG elements */ 22 | // import 'classlist.js'; // Run `npm install --save classlist.js`. 23 | 24 | /** 25 | * Web Animations `@angular/platform-browser/animations` 26 | * Only required if AnimationBuilder is used within the application and using IE/Edge or Safari. 27 | * Standard animation support in Angular DOES NOT require any polyfills (as of Angular 6.0). 28 | */ 29 | // import 'web-animations-js'; // Run `npm install --save web-animations-js`. 30 | 31 | /** 32 | * By default, zone.js will patch all possible macroTask and DomEvents 33 | * user can disable parts of macroTask/DomEvents patch by setting following flags 34 | * because those flags need to be set before `zone.js` being loaded, and webpack 35 | * will put import in the top of bundle, so user need to create a separate file 36 | * in this directory (for example: zone-flags.ts), and put the following flags 37 | * into that file, and then add the following code before importing zone.js. 38 | * import './zone-flags.ts'; 39 | * 40 | * The flags allowed in zone-flags.ts are listed here. 41 | * 42 | * The following flags will work for all browsers. 43 | * 44 | * (window as any).__Zone_disable_requestAnimationFrame = true; // disable patch requestAnimationFrame 45 | * (window as any).__Zone_disable_on_property = true; // disable patch onProperty such as onclick 46 | * (window as any).__zone_symbol__BLACK_LISTED_EVENTS = ['scroll', 'mousemove']; // disable patch specified eventNames 47 | * 48 | * in IE/Edge developer tools, the addEventListener will also be wrapped by zone.js 49 | * with the following flag, it will bypass `zone.js` patch for IE/Edge 50 | * 51 | * (window as any).__Zone_enable_cross_context_check = true; 52 | * 53 | */ 54 | 55 | /*************************************************************************************************** 56 | * Zone JS is required by default for Angular itself. 57 | */ 58 | import 'zone.js/dist/zone'; // Included with Angular CLI. 59 | 60 | 61 | /*************************************************************************************************** 62 | * APPLICATION IMPORTS 63 | */ 64 | -------------------------------------------------------------------------------- /firstapp/src/styles.css: -------------------------------------------------------------------------------- 1 | /* You can add global styles to this file, and also import other style files */ 2 | -------------------------------------------------------------------------------- /firstapp/src/test.ts: -------------------------------------------------------------------------------- 1 | // This file is required by karma.conf.js and loads recursively all the .spec and framework files 2 | 3 | import 'zone.js/dist/zone-testing'; 4 | import { getTestBed } from '@angular/core/testing'; 5 | import { 6 | BrowserDynamicTestingModule, 7 | platformBrowserDynamicTesting 8 | } from '@angular/platform-browser-dynamic/testing'; 9 | 10 | declare const require: any; 11 | 12 | // First, initialize the Angular testing environment. 13 | getTestBed().initTestEnvironment( 14 | BrowserDynamicTestingModule, 15 | platformBrowserDynamicTesting() 16 | ); 17 | // Then we find all the tests. 18 | const context = require.context('./', true, /\.spec\.ts$/); 19 | // And load the modules. 20 | context.keys().map(context); 21 | -------------------------------------------------------------------------------- /firstapp/src/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "types": [] 6 | }, 7 | "exclude": [ 8 | "test.ts", 9 | "**/*.spec.ts" 10 | ] 11 | } 12 | -------------------------------------------------------------------------------- /firstapp/src/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/spec", 5 | "types": [ 6 | "jasmine", 7 | "node" 8 | ] 9 | }, 10 | "files": [ 11 | "test.ts", 12 | "polyfills.ts" 13 | ], 14 | "include": [ 15 | "**/*.spec.ts", 16 | "**/*.d.ts" 17 | ] 18 | } 19 | -------------------------------------------------------------------------------- /firstapp/src/tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tslint.json", 3 | "rules": { 4 | "directive-selector": [ 5 | true, 6 | "attribute", 7 | "app", 8 | "camelCase" 9 | ], 10 | "component-selector": [ 11 | true, 12 | "element", 13 | "app", 14 | "kebab-case" 15 | ] 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /firstapp/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compileOnSave": false, 3 | "compilerOptions": { 4 | "baseUrl": "./", 5 | "outDir": "./dist/out-tsc", 6 | "sourceMap": true, 7 | "declaration": false, 8 | "module": "es2015", 9 | "moduleResolution": "node", 10 | "emitDecoratorMetadata": true, 11 | "experimentalDecorators": true, 12 | "importHelpers": true, 13 | "target": "es5", 14 | "typeRoots": [ 15 | "node_modules/@types" 16 | ], 17 | "lib": [ 18 | "es2018", 19 | "dom" 20 | ] 21 | } 22 | } 23 | -------------------------------------------------------------------------------- /firstapp/tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "tslint:recommended", 3 | "rulesDirectory": [ 4 | "codelyzer" 5 | ], 6 | "rules": { 7 | "array-type": false, 8 | "arrow-parens": false, 9 | "deprecation": { 10 | "severity": "warn" 11 | }, 12 | "import-blacklist": [ 13 | true, 14 | "rxjs/Rx" 15 | ], 16 | "interface-name": false, 17 | "max-classes-per-file": false, 18 | "max-line-length": [ 19 | true, 20 | 140 21 | ], 22 | "member-access": false, 23 | "member-ordering": [ 24 | true, 25 | { 26 | "order": [ 27 | "static-field", 28 | "instance-field", 29 | "static-method", 30 | "instance-method" 31 | ] 32 | } 33 | ], 34 | "no-consecutive-blank-lines": false, 35 | "no-console": [ 36 | true, 37 | "debug", 38 | "info", 39 | "time", 40 | "timeEnd", 41 | "trace" 42 | ], 43 | "no-empty": false, 44 | "no-inferrable-types": [ 45 | true, 46 | "ignore-params" 47 | ], 48 | "no-non-null-assertion": true, 49 | "no-redundant-jsdoc": true, 50 | "no-switch-case-fall-through": true, 51 | "no-use-before-declare": true, 52 | "no-var-requires": false, 53 | "object-literal-key-quotes": [ 54 | true, 55 | "as-needed" 56 | ], 57 | "object-literal-sort-keys": false, 58 | "ordered-imports": false, 59 | "quotemark": [ 60 | true, 61 | "single" 62 | ], 63 | "trailing-comma": false, 64 | "no-output-on-prefix": true, 65 | "use-input-property-decorator": true, 66 | "use-output-property-decorator": true, 67 | "use-host-property-decorator": true, 68 | "no-input-rename": true, 69 | "no-output-rename": true, 70 | "use-life-cycle-interface": true, 71 | "use-pipe-transform-interface": true, 72 | "component-class-suffix": true, 73 | "directive-class-suffix": true 74 | } 75 | } 76 | -------------------------------------------------------------------------------- /learnpackage/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "myapp", 3 | "version": "1.0.0", 4 | "description": "this is about the packge", 5 | "main": "index.js", 6 | "scripts": { 7 | "test": "echo \"Error: no test specified\" && exit 1" 8 | }, 9 | "keywords": [ 10 | "node", 11 | "angular" 12 | ], 13 | "author": "Edureka", 14 | "license": "ISC", 15 | "dependencies": { 16 | "@aakashdeveloper/create-node-app": "^1.0.41", 17 | "zone.js": "^0.9.0" 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /loginapp/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see https://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /loginapp/.gitignore: -------------------------------------------------------------------------------- 1 | # See http://help.github.com/ignore-files/ for more about ignoring files. 2 | 3 | # compiled output 4 | /dist 5 | /tmp 6 | /out-tsc 7 | # Only exists if Bazel was run 8 | /bazel-out 9 | 10 | # dependencies 11 | /node_modules 12 | 13 | # profiling files 14 | chrome-profiler-events.json 15 | speed-measure-plugin.json 16 | 17 | # IDEs and editors 18 | /.idea 19 | .project 20 | .classpath 21 | .c9/ 22 | *.launch 23 | .settings/ 24 | *.sublime-workspace 25 | 26 | # IDE - VSCode 27 | .vscode/* 28 | !.vscode/settings.json 29 | !.vscode/tasks.json 30 | !.vscode/launch.json 31 | !.vscode/extensions.json 32 | .history/* 33 | 34 | # misc 35 | /.sass-cache 36 | /connect.lock 37 | /coverage 38 | /libpeerconnection.log 39 | npm-debug.log 40 | yarn-error.log 41 | testem.log 42 | /typings 43 | 44 | # System Files 45 | .DS_Store 46 | Thumbs.db 47 | -------------------------------------------------------------------------------- /loginapp/README.md: -------------------------------------------------------------------------------- 1 | # Loginapp 2 | 3 | This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 7.3.6. 4 | 5 | ## Development server 6 | 7 | Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files. 8 | 9 | ## Code scaffolding 10 | 11 | Run `ng generate component component-name` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module`. 12 | 13 | ## Build 14 | 15 | Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory. Use the `--prod` flag for a production build. 16 | 17 | ## Running unit tests 18 | 19 | Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io). 20 | 21 | ## Running end-to-end tests 22 | 23 | Run `ng e2e` to execute the end-to-end tests via [Protractor](http://www.protractortest.org/). 24 | 25 | ## Further help 26 | 27 | To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI README](https://github.com/angular/angular-cli/blob/master/README.md). 28 | -------------------------------------------------------------------------------- /loginapp/angular.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "./node_modules/@angular/cli/lib/config/schema.json", 3 | "version": 1, 4 | "newProjectRoot": "projects", 5 | "projects": { 6 | "loginapp": { 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/loginapp", 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 | "es5BrowserSupport": true 30 | }, 31 | "configurations": { 32 | "production": { 33 | "fileReplacements": [ 34 | { 35 | "replace": "src/environments/environment.ts", 36 | "with": "src/environments/environment.prod.ts" 37 | } 38 | ], 39 | "optimization": true, 40 | "outputHashing": "all", 41 | "sourceMap": false, 42 | "extractCss": true, 43 | "namedChunks": false, 44 | "aot": true, 45 | "extractLicenses": true, 46 | "vendorChunk": false, 47 | "buildOptimizer": true, 48 | "budgets": [ 49 | { 50 | "type": "initial", 51 | "maximumWarning": "2mb", 52 | "maximumError": "5mb" 53 | } 54 | ] 55 | } 56 | } 57 | }, 58 | "serve": { 59 | "builder": "@angular-devkit/build-angular:dev-server", 60 | "options": { 61 | "browserTarget": "loginapp:build" 62 | }, 63 | "configurations": { 64 | "production": { 65 | "browserTarget": "loginapp:build:production" 66 | } 67 | } 68 | }, 69 | "extract-i18n": { 70 | "builder": "@angular-devkit/build-angular:extract-i18n", 71 | "options": { 72 | "browserTarget": "loginapp:build" 73 | } 74 | }, 75 | "test": { 76 | "builder": "@angular-devkit/build-angular:karma", 77 | "options": { 78 | "main": "src/test.ts", 79 | "polyfills": "src/polyfills.ts", 80 | "tsConfig": "src/tsconfig.spec.json", 81 | "karmaConfig": "src/karma.conf.js", 82 | "styles": [ 83 | "src/styles.css" 84 | ], 85 | "scripts": [], 86 | "assets": [ 87 | "src/favicon.ico", 88 | "src/assets" 89 | ] 90 | } 91 | }, 92 | "lint": { 93 | "builder": "@angular-devkit/build-angular:tslint", 94 | "options": { 95 | "tsConfig": [ 96 | "src/tsconfig.app.json", 97 | "src/tsconfig.spec.json" 98 | ], 99 | "exclude": [ 100 | "**/node_modules/**" 101 | ] 102 | } 103 | } 104 | } 105 | }, 106 | "loginapp-e2e": { 107 | "root": "e2e/", 108 | "projectType": "application", 109 | "prefix": "", 110 | "architect": { 111 | "e2e": { 112 | "builder": "@angular-devkit/build-angular:protractor", 113 | "options": { 114 | "protractorConfig": "e2e/protractor.conf.js", 115 | "devServerTarget": "loginapp:serve" 116 | }, 117 | "configurations": { 118 | "production": { 119 | "devServerTarget": "loginapp:serve:production" 120 | } 121 | } 122 | }, 123 | "lint": { 124 | "builder": "@angular-devkit/build-angular:tslint", 125 | "options": { 126 | "tsConfig": "e2e/tsconfig.e2e.json", 127 | "exclude": [ 128 | "**/node_modules/**" 129 | ] 130 | } 131 | } 132 | } 133 | } 134 | }, 135 | "defaultProject": "loginapp" 136 | } -------------------------------------------------------------------------------- /loginapp/e2e/protractor.conf.js: -------------------------------------------------------------------------------- 1 | // Protractor configuration file, see link for more information 2 | // https://github.com/angular/protractor/blob/master/lib/config.ts 3 | 4 | const { SpecReporter } = require('jasmine-spec-reporter'); 5 | 6 | exports.config = { 7 | allScriptsTimeout: 11000, 8 | specs: [ 9 | './src/**/*.e2e-spec.ts' 10 | ], 11 | capabilities: { 12 | 'browserName': 'chrome' 13 | }, 14 | directConnect: true, 15 | baseUrl: 'http://localhost:4200/', 16 | framework: 'jasmine', 17 | jasmineNodeOpts: { 18 | showColors: true, 19 | defaultTimeoutInterval: 30000, 20 | print: function() {} 21 | }, 22 | onPrepare() { 23 | require('ts-node').register({ 24 | project: require('path').join(__dirname, './tsconfig.e2e.json') 25 | }); 26 | jasmine.getEnv().addReporter(new SpecReporter({ spec: { displayStacktrace: true } })); 27 | } 28 | }; -------------------------------------------------------------------------------- /loginapp/e2e/src/app.e2e-spec.ts: -------------------------------------------------------------------------------- 1 | import { AppPage } from './app.po'; 2 | import { browser, logging } from 'protractor'; 3 | 4 | describe('workspace-project App', () => { 5 | let page: AppPage; 6 | 7 | beforeEach(() => { 8 | page = new AppPage(); 9 | }); 10 | 11 | it('should display welcome message', () => { 12 | page.navigateTo(); 13 | expect(page.getTitleText()).toEqual('Welcome to loginapp!'); 14 | }); 15 | 16 | afterEach(async () => { 17 | // Assert that there are no errors emitted from the browser 18 | const logs = await browser.manage().logs().get(logging.Type.BROWSER); 19 | expect(logs).not.toContain(jasmine.objectContaining({ 20 | level: logging.Level.SEVERE, 21 | } as logging.Entry)); 22 | }); 23 | }); 24 | -------------------------------------------------------------------------------- /loginapp/e2e/src/app.po.ts: -------------------------------------------------------------------------------- 1 | import { browser, by, element } from 'protractor'; 2 | 3 | export class AppPage { 4 | navigateTo() { 5 | return browser.get(browser.baseUrl) as Promise; 6 | } 7 | 8 | getTitleText() { 9 | return element(by.css('app-root h1')).getText() as Promise; 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /loginapp/e2e/tsconfig.e2e.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "module": "commonjs", 6 | "target": "es5", 7 | "types": [ 8 | "jasmine", 9 | "jasminewd2", 10 | "node" 11 | ] 12 | } 13 | } -------------------------------------------------------------------------------- /loginapp/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "loginapp", 3 | "version": "0.0.0", 4 | "scripts": { 5 | "ng": "ng", 6 | "start": "ng serve", 7 | "build": "ng build", 8 | "test": "ng test", 9 | "lint": "ng lint", 10 | "e2e": "ng e2e" 11 | }, 12 | "private": true, 13 | "dependencies": { 14 | "@angular/animations": "~7.2.0", 15 | "@angular/common": "~7.2.0", 16 | "@angular/compiler": "~7.2.0", 17 | "@angular/core": "~7.2.0", 18 | "@angular/forms": "~7.2.0", 19 | "@angular/platform-browser": "~7.2.0", 20 | "@angular/platform-browser-dynamic": "~7.2.0", 21 | "@angular/router": "~7.2.0", 22 | "core-js": "^2.5.4", 23 | "rxjs": "~6.3.3", 24 | "tslib": "^1.9.0", 25 | "zone.js": "~0.8.26" 26 | }, 27 | "devDependencies": { 28 | "@angular-devkit/build-angular": "~0.13.0", 29 | "@angular/cli": "~7.3.6", 30 | "@angular/compiler-cli": "~7.2.0", 31 | "@angular/language-service": "~7.2.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": "~4.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.2.2" 47 | } 48 | } 49 | -------------------------------------------------------------------------------- /loginapp/src/app/app-routing.module.ts: -------------------------------------------------------------------------------- 1 | import { NgModule } from '@angular/core'; 2 | import { Routes, RouterModule } from '@angular/router'; 3 | import { RegisterFormComponent } from './register-form/register-form.component'; 4 | import { LoginFormComponent } from './login-form/login-form.component'; 5 | import { ProfileComponent } from './profile/profile.component'; 6 | import { ProfileGaurdService } from './profile-guard.service'; 7 | import { RegisterGaurdService } from './register-gaurd.service'; 8 | 9 | const routes: Routes = [ 10 | {path: 'register', canActivate: [RegisterGaurdService], component: RegisterFormComponent }, 11 | {path: 'profile', canActivate: [ProfileGaurdService], component: ProfileComponent }, 12 | {path: 'login', component: LoginFormComponent }, 13 | {path: '', redirectTo: 'login', pathMatch: 'full' } 14 | ]; 15 | 16 | @NgModule({ 17 | imports: [RouterModule.forRoot(routes)], 18 | exports: [RouterModule], 19 | providers: [ProfileGaurdService, RegisterGaurdService ] 20 | }) 21 | export class AppRoutingModule { } 22 | -------------------------------------------------------------------------------- /loginapp/src/app/app.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Aakashdeveloper/EDU_APR_ANG_MRNG/6dd4be6100bb82d97011392ac966f0126db01702/loginapp/src/app/app.component.css -------------------------------------------------------------------------------- /loginapp/src/app/app.component.html: -------------------------------------------------------------------------------- 1 | 2 |
3 | 21 | 22 |
23 | -------------------------------------------------------------------------------- /loginapp/src/app/app.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { TestBed, async } from '@angular/core/testing'; 2 | import { RouterTestingModule } from '@angular/router/testing'; 3 | import { AppComponent } from './app.component'; 4 | 5 | describe('AppComponent', () => { 6 | beforeEach(async(() => { 7 | TestBed.configureTestingModule({ 8 | imports: [ 9 | RouterTestingModule 10 | ], 11 | declarations: [ 12 | AppComponent 13 | ], 14 | }).compileComponents(); 15 | })); 16 | 17 | it('should create the app', () => { 18 | const fixture = TestBed.createComponent(AppComponent); 19 | const app = fixture.debugElement.componentInstance; 20 | expect(app).toBeTruthy(); 21 | }); 22 | 23 | it(`should have as title 'loginapp'`, () => { 24 | const fixture = TestBed.createComponent(AppComponent); 25 | const app = fixture.debugElement.componentInstance; 26 | expect(app.title).toEqual('loginapp'); 27 | }); 28 | 29 | it('should render title in a h1 tag', () => { 30 | const fixture = TestBed.createComponent(AppComponent); 31 | fixture.detectChanges(); 32 | const compiled = fixture.debugElement.nativeElement; 33 | expect(compiled.querySelector('h1').textContent).toContain('Welcome to loginapp!'); 34 | }); 35 | }); 36 | -------------------------------------------------------------------------------- /loginapp/src/app/app.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | import { Router } from '@angular/router'; 3 | 4 | @Component({ 5 | selector: 'app-root', 6 | templateUrl: './app.component.html', 7 | styleUrls: ['./app.component.css'] 8 | }) 9 | export class AppComponent { 10 | title = 'loginapp'; 11 | 12 | constructor(private router: Router) {} 13 | 14 | logoutUser(): void { 15 | localStorage.removeItem('TOKEN_NUMBER'); 16 | localStorage.removeItem('ROLE_TYPE'); 17 | this.router.navigate(['/login']); 18 | alert('Succesfully logout'); 19 | } 20 | } 21 | -------------------------------------------------------------------------------- /loginapp/src/app/app.module.ts: -------------------------------------------------------------------------------- 1 | import { BrowserModule } from '@angular/platform-browser'; 2 | import { NgModule } from '@angular/core'; 3 | import { FormsModule } from '@angular/forms'; 4 | import { HttpClientModule} from '@angular/common/http'; 5 | 6 | import { AppRoutingModule } from './app-routing.module'; 7 | import { AppComponent } from './app.component'; 8 | import { RegisterFormComponent } from './register-form/register-form.component'; 9 | import { LoginFormComponent } from './login-form/login-form.component'; 10 | import { LoginService } from './login-form/login.service'; 11 | import { ProfileComponent } from './profile/profile.component'; 12 | import { RegisterService } from './register-form/register.service'; 13 | 14 | @NgModule({ 15 | declarations: [ 16 | AppComponent, 17 | RegisterFormComponent, 18 | LoginFormComponent, 19 | ProfileComponent 20 | ], 21 | imports: [ 22 | BrowserModule, 23 | AppRoutingModule, 24 | HttpClientModule, 25 | FormsModule 26 | ], 27 | providers: [ 28 | LoginService, 29 | RegisterService 30 | ], 31 | bootstrap: [AppComponent] 32 | }) 33 | export class AppModule { } 34 | -------------------------------------------------------------------------------- /loginapp/src/app/login-form/login-form.component.html: -------------------------------------------------------------------------------- 1 |
2 |
3 | Login Form 4 |
5 |
6 |
7 |
8 | 11 | 17 |
18 | Please enter valid Email 19 |
20 |
21 |
22 | 25 | 31 |
32 | Min length of Password is 8 33 |
34 |
35 | 39 |
40 |
41 |
-------------------------------------------------------------------------------- /loginapp/src/app/login-form/login-form.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | import { LoginModal } from './login.model'; 3 | import { NgForm } from '@angular/forms'; 4 | import { LoginService } from './login.service'; 5 | import { Router } from '@angular/router'; 6 | 7 | @Component({ 8 | selector: 'app-cust', 9 | templateUrl: './login-form.component.html' 10 | }) 11 | 12 | 13 | export class LoginFormComponent { 14 | 15 | mymodel = new LoginModal('j@gmail.com', '12345678'); 16 | 17 | constructor(private loginService: LoginService, 18 | private router: Router) {} 19 | 20 | loginForm(form: NgForm): void { 21 | this.loginService.loginUser(form.value) 22 | .subscribe((res) => this.loginService.getUserRole(res['token']) 23 | .subscribe((response) => this.validateUser(response['role']))); 24 | } 25 | 26 | validateUser(typeOfUser): void { 27 | localStorage.setItem('ROLE_TYPE', typeOfUser); 28 | this.router.navigate(['/profile']); 29 | } 30 | 31 | } 32 | -------------------------------------------------------------------------------- /loginapp/src/app/login-form/login.model.ts: -------------------------------------------------------------------------------- 1 | export class LoginModal { 2 | constructor( 3 | public email: string, 4 | public password: string 5 | ) {} 6 | } 7 | -------------------------------------------------------------------------------- /loginapp/src/app/login-form/login.service.ts: -------------------------------------------------------------------------------- 1 | import { Injectable } from '@angular/core'; 2 | import { LoginModal } from './login.model'; 3 | import { HttpClient } from '@angular/common/http'; 4 | 5 | @Injectable() 6 | 7 | export class LoginService { 8 | 9 | private url = 'http://localhost:5000/api/auth/login'; 10 | private userinfo = 'http://localhost:5000/api/auth/userinfo'; 11 | 12 | constructor(private http: HttpClient) {} 13 | 14 | loginUser( luser: LoginModal) { 15 | return this.http.post(this.url, luser ); 16 | } 17 | getUserRole(token) { 18 | localStorage.setItem('TOKEN_NUMBER', token); 19 | return this.http.get(this.userinfo, {headers: {'x-access-token': token}}); 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /loginapp/src/app/profile-guard.service.ts: -------------------------------------------------------------------------------- 1 | import { Injectable } from '@angular/core'; 2 | import { CanActivate, ActivatedRouteSnapshot, Router } from '@angular/router'; 3 | 4 | @Injectable() 5 | 6 | export class ProfileGaurdService implements CanActivate { 7 | token: string; 8 | 9 | constructor(private router: Router ) {} 10 | 11 | canActivate(router: ActivatedRouteSnapshot): boolean { 12 | this.token = localStorage.getItem('TOKEN_NUMBER'); 13 | if (this.token === null) { 14 | this.router.navigate(['/login']); 15 | return false; 16 | } 17 | 18 | return true; 19 | } 20 | } 21 | -------------------------------------------------------------------------------- /loginapp/src/app/profile/profile.component.html: -------------------------------------------------------------------------------- 1 |

2 | Hi {{userinfo.name}} 3 |

4 |

5 | Your role is {{userinfo.role}} 6 |

7 |

You have Permission to 8 | {{userinfo.role === "admin"?"Add new user":"view your profile"}} 9 |

10 |
11 | 14 |
-------------------------------------------------------------------------------- /loginapp/src/app/profile/profile.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { LoginService } from '../login-form/login.service'; 3 | 4 | @Component({ 5 | selector: 'app-cust', 6 | templateUrl: './profile.component.html' 7 | }) 8 | 9 | 10 | export class ProfileComponent implements OnInit { 11 | 12 | userinfo; 13 | token: string; 14 | 15 | constructor(private loginService: LoginService) {} 16 | 17 | ngOnInit() { 18 | this.token = localStorage.getItem('TOKEN_NUMBER'); 19 | this.loginService.getUserRole(this.token) 20 | .subscribe((res) => this.userinfo = res); 21 | } 22 | } 23 | -------------------------------------------------------------------------------- /loginapp/src/app/register-form/register-form.component.html: -------------------------------------------------------------------------------- 1 |
2 |
3 | Register Form 4 |
5 |
6 |
7 |
8 | 11 | 17 |
18 | Name is required 19 |
20 |
21 |
22 | 25 | 31 |
32 | Please enter valid Email 33 |
34 |
35 |
36 | 39 | 45 |
46 | Min length of Password is 8 47 |
48 |
49 | 54 |
55 |
56 |
-------------------------------------------------------------------------------- /loginapp/src/app/register-form/register-form.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | import { RegisterModal } from './register.model'; 3 | import { NgForm } from '@angular/forms'; 4 | import { RegisterService } from './register.service'; 5 | import { Router } from '@angular/router'; 6 | 7 | @Component({ 8 | selector: 'app-cust', 9 | templateUrl: './register-form.component.html' 10 | }) 11 | 12 | 13 | export class RegisterFormComponent { 14 | 15 | mymodel = new RegisterModal('John', 'j@gmail.com', '12345678'); 16 | 17 | 18 | constructor(private registerService: RegisterService, 19 | private router: Router) {} 20 | 21 | RegsiterForm(form: NgForm): void { 22 | this.registerService.registerUser(form.value) 23 | .subscribe((res) => this.router.navigate(['/login'])); 24 | } 25 | 26 | } 27 | -------------------------------------------------------------------------------- /loginapp/src/app/register-form/register.model.ts: -------------------------------------------------------------------------------- 1 | export class RegisterModal { 2 | constructor( 3 | public name: string, 4 | public email: string, 5 | public password: string 6 | ) {} 7 | } 8 | -------------------------------------------------------------------------------- /loginapp/src/app/register-form/register.service.ts: -------------------------------------------------------------------------------- 1 | import { Injectable } from '@angular/core'; 2 | import { RegisterModal } from './register.model'; 3 | import { HttpClient } from '@angular/common/http'; 4 | 5 | @Injectable() 6 | 7 | export class RegisterService { 8 | 9 | private url = 'http://localhost:5000/api/auth/register'; 10 | 11 | constructor(private http: HttpClient) {} 12 | 13 | registerUser( ruser: RegisterModal) { 14 | // console.log('>>>>Data in service ', customer); 15 | return this.http.post(this.url, ruser ); 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /loginapp/src/app/register-gaurd.service.ts: -------------------------------------------------------------------------------- 1 | import { Injectable } from '@angular/core'; 2 | import { CanActivate, ActivatedRouteSnapshot, Router } from '@angular/router'; 3 | 4 | @Injectable() 5 | 6 | export class RegisterGaurdService implements CanActivate { 7 | token: string; 8 | role: string; 9 | 10 | constructor(private router: Router ) {} 11 | 12 | canActivate(route: ActivatedRouteSnapshot): boolean { 13 | this.token = localStorage.getItem('TOKEN_NUMBER'); 14 | this.role = localStorage.getItem('ROLE_TYPE'); 15 | if (this.token === null) { 16 | this.router.navigate(['/login']); 17 | return false; 18 | } 19 | if (this.token !== null && this.role === 'admin') { 20 | return true; 21 | } 22 | } 23 | } 24 | -------------------------------------------------------------------------------- /loginapp/src/assets/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Aakashdeveloper/EDU_APR_ANG_MRNG/6dd4be6100bb82d97011392ac966f0126db01702/loginapp/src/assets/.gitkeep -------------------------------------------------------------------------------- /loginapp/src/browserslist: -------------------------------------------------------------------------------- 1 | # This file is currently used by autoprefixer to adjust CSS to support the below specified browsers 2 | # For additional information regarding the format and rule options, please see: 3 | # https://github.com/browserslist/browserslist#queries 4 | # 5 | # For IE 9-11 support, please remove 'not' from the last line of the file and adjust as needed 6 | 7 | > 0.5% 8 | last 2 versions 9 | Firefox ESR 10 | not dead 11 | not IE 9-11 -------------------------------------------------------------------------------- /loginapp/src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true 3 | }; 4 | -------------------------------------------------------------------------------- /loginapp/src/environments/environment.ts: -------------------------------------------------------------------------------- 1 | // This file can be replaced during build by using the `fileReplacements` array. 2 | // `ng build --prod` replaces `environment.ts` with `environment.prod.ts`. 3 | // The list of file replacements can be found in `angular.json`. 4 | 5 | export const environment = { 6 | production: false 7 | }; 8 | 9 | /* 10 | * For easier debugging in development mode, you can import the following file 11 | * to ignore zone related error stack frames such as `zone.run`, `zoneDelegate.invokeTask`. 12 | * 13 | * This import should be commented out in production mode because it will have a negative impact 14 | * on performance if an error is thrown. 15 | */ 16 | // import 'zone.js/dist/zone-error'; // Included with Angular CLI. 17 | -------------------------------------------------------------------------------- /loginapp/src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Aakashdeveloper/EDU_APR_ANG_MRNG/6dd4be6100bb82d97011392ac966f0126db01702/loginapp/src/favicon.ico -------------------------------------------------------------------------------- /loginapp/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Loginapp 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 |
18 | 19 |
20 | 21 | 22 | -------------------------------------------------------------------------------- /loginapp/src/karma.conf.js: -------------------------------------------------------------------------------- 1 | // Karma configuration file, see link for more information 2 | // https://karma-runner.github.io/1.0/config/configuration-file.html 3 | 4 | module.exports = function (config) { 5 | config.set({ 6 | basePath: '', 7 | frameworks: ['jasmine', '@angular-devkit/build-angular'], 8 | plugins: [ 9 | require('karma-jasmine'), 10 | require('karma-chrome-launcher'), 11 | require('karma-jasmine-html-reporter'), 12 | require('karma-coverage-istanbul-reporter'), 13 | require('@angular-devkit/build-angular/plugins/karma') 14 | ], 15 | client: { 16 | clearContext: false // leave Jasmine Spec Runner output visible in browser 17 | }, 18 | coverageIstanbulReporter: { 19 | dir: require('path').join(__dirname, '../coverage/loginapp'), 20 | reports: ['html', 'lcovonly', 'text-summary'], 21 | fixWebpackSourcePaths: true 22 | }, 23 | reporters: ['progress', 'kjhtml'], 24 | port: 9876, 25 | colors: true, 26 | logLevel: config.LOG_INFO, 27 | autoWatch: true, 28 | browsers: ['Chrome'], 29 | singleRun: false, 30 | restartOnFileChange: true 31 | }); 32 | }; 33 | -------------------------------------------------------------------------------- /loginapp/src/main.ts: -------------------------------------------------------------------------------- 1 | import { enableProdMode } from '@angular/core'; 2 | import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; 3 | 4 | import { AppModule } from './app/app.module'; 5 | import { environment } from './environments/environment'; 6 | 7 | if (environment.production) { 8 | enableProdMode(); 9 | } 10 | 11 | platformBrowserDynamic().bootstrapModule(AppModule) 12 | .catch(err => console.error(err)); 13 | -------------------------------------------------------------------------------- /loginapp/src/polyfills.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * This file includes polyfills needed by Angular and is loaded before the app. 3 | * You can add your own extra polyfills to this file. 4 | * 5 | * This file is divided into 2 sections: 6 | * 1. Browser polyfills. These are applied before loading ZoneJS and are sorted by browsers. 7 | * 2. Application imports. Files imported after ZoneJS that should be loaded before your main 8 | * file. 9 | * 10 | * The current setup is for so-called "evergreen" browsers; the last versions of browsers that 11 | * automatically update themselves. This includes Safari >= 10, Chrome >= 55 (including Opera), 12 | * Edge >= 13 on the desktop, and iOS 10 and Chrome on mobile. 13 | * 14 | * Learn more in https://angular.io/guide/browser-support 15 | */ 16 | 17 | /*************************************************************************************************** 18 | * BROWSER POLYFILLS 19 | */ 20 | 21 | /** IE10 and IE11 requires the following for NgClass support on SVG elements */ 22 | // import 'classlist.js'; // Run `npm install --save classlist.js`. 23 | 24 | /** 25 | * Web Animations `@angular/platform-browser/animations` 26 | * Only required if AnimationBuilder is used within the application and using IE/Edge or Safari. 27 | * Standard animation support in Angular DOES NOT require any polyfills (as of Angular 6.0). 28 | */ 29 | // import 'web-animations-js'; // Run `npm install --save web-animations-js`. 30 | 31 | /** 32 | * By default, zone.js will patch all possible macroTask and DomEvents 33 | * user can disable parts of macroTask/DomEvents patch by setting following flags 34 | * because those flags need to be set before `zone.js` being loaded, and webpack 35 | * will put import in the top of bundle, so user need to create a separate file 36 | * in this directory (for example: zone-flags.ts), and put the following flags 37 | * into that file, and then add the following code before importing zone.js. 38 | * import './zone-flags.ts'; 39 | * 40 | * The flags allowed in zone-flags.ts are listed here. 41 | * 42 | * The following flags will work for all browsers. 43 | * 44 | * (window as any).__Zone_disable_requestAnimationFrame = true; // disable patch requestAnimationFrame 45 | * (window as any).__Zone_disable_on_property = true; // disable patch onProperty such as onclick 46 | * (window as any).__zone_symbol__BLACK_LISTED_EVENTS = ['scroll', 'mousemove']; // disable patch specified eventNames 47 | * 48 | * in IE/Edge developer tools, the addEventListener will also be wrapped by zone.js 49 | * with the following flag, it will bypass `zone.js` patch for IE/Edge 50 | * 51 | * (window as any).__Zone_enable_cross_context_check = true; 52 | * 53 | */ 54 | 55 | /*************************************************************************************************** 56 | * Zone JS is required by default for Angular itself. 57 | */ 58 | import 'zone.js/dist/zone'; // Included with Angular CLI. 59 | 60 | 61 | /*************************************************************************************************** 62 | * APPLICATION IMPORTS 63 | */ 64 | -------------------------------------------------------------------------------- /loginapp/src/styles.css: -------------------------------------------------------------------------------- 1 | /* You can add global styles to this file, and also import other style files */ 2 | -------------------------------------------------------------------------------- /loginapp/src/test.ts: -------------------------------------------------------------------------------- 1 | // This file is required by karma.conf.js and loads recursively all the .spec and framework files 2 | 3 | import 'zone.js/dist/zone-testing'; 4 | import { getTestBed } from '@angular/core/testing'; 5 | import { 6 | BrowserDynamicTestingModule, 7 | platformBrowserDynamicTesting 8 | } from '@angular/platform-browser-dynamic/testing'; 9 | 10 | declare const require: any; 11 | 12 | // First, initialize the Angular testing environment. 13 | getTestBed().initTestEnvironment( 14 | BrowserDynamicTestingModule, 15 | platformBrowserDynamicTesting() 16 | ); 17 | // Then we find all the tests. 18 | const context = require.context('./', true, /\.spec\.ts$/); 19 | // And load the modules. 20 | context.keys().map(context); 21 | -------------------------------------------------------------------------------- /loginapp/src/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "types": [] 6 | }, 7 | "exclude": [ 8 | "test.ts", 9 | "**/*.spec.ts" 10 | ] 11 | } 12 | -------------------------------------------------------------------------------- /loginapp/src/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/spec", 5 | "types": [ 6 | "jasmine", 7 | "node" 8 | ] 9 | }, 10 | "files": [ 11 | "test.ts", 12 | "polyfills.ts" 13 | ], 14 | "include": [ 15 | "**/*.spec.ts", 16 | "**/*.d.ts" 17 | ] 18 | } 19 | -------------------------------------------------------------------------------- /loginapp/src/tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tslint.json", 3 | "rules": { 4 | "directive-selector": [ 5 | true, 6 | "attribute", 7 | "app", 8 | "camelCase" 9 | ], 10 | "component-selector": [ 11 | true, 12 | "element", 13 | "app", 14 | "kebab-case" 15 | ] 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /loginapp/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compileOnSave": false, 3 | "compilerOptions": { 4 | "baseUrl": "./", 5 | "outDir": "./dist/out-tsc", 6 | "sourceMap": true, 7 | "declaration": false, 8 | "module": "es2015", 9 | "moduleResolution": "node", 10 | "emitDecoratorMetadata": true, 11 | "experimentalDecorators": true, 12 | "importHelpers": true, 13 | "target": "es5", 14 | "typeRoots": [ 15 | "node_modules/@types" 16 | ], 17 | "lib": [ 18 | "es2018", 19 | "dom" 20 | ] 21 | } 22 | } 23 | -------------------------------------------------------------------------------- /loginapp/tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "tslint:recommended", 3 | "rulesDirectory": [ 4 | "codelyzer" 5 | ], 6 | "rules": { 7 | "array-type": false, 8 | "arrow-parens": false, 9 | "deprecation": { 10 | "severity": "warn" 11 | }, 12 | "import-blacklist": [ 13 | true, 14 | "rxjs/Rx" 15 | ], 16 | "interface-name": false, 17 | "max-classes-per-file": false, 18 | "max-line-length": [ 19 | true, 20 | 140 21 | ], 22 | "member-access": false, 23 | "member-ordering": [ 24 | true, 25 | { 26 | "order": [ 27 | "static-field", 28 | "instance-field", 29 | "static-method", 30 | "instance-method" 31 | ] 32 | } 33 | ], 34 | "no-consecutive-blank-lines": false, 35 | "no-console": [ 36 | true, 37 | "debug", 38 | "info", 39 | "time", 40 | "timeEnd", 41 | "trace" 42 | ], 43 | "no-empty": false, 44 | "no-inferrable-types": [ 45 | true, 46 | "ignore-params" 47 | ], 48 | "no-non-null-assertion": true, 49 | "no-redundant-jsdoc": true, 50 | "no-switch-case-fall-through": true, 51 | "no-use-before-declare": true, 52 | "no-var-requires": false, 53 | "object-literal-key-quotes": [ 54 | true, 55 | "as-needed" 56 | ], 57 | "object-literal-sort-keys": false, 58 | "ordered-imports": false, 59 | "quotemark": [ 60 | true, 61 | "single" 62 | ], 63 | "trailing-comma": false, 64 | "no-output-on-prefix": true, 65 | "use-input-property-decorator": true, 66 | "use-output-property-decorator": true, 67 | "use-host-property-decorator": true, 68 | "no-input-rename": true, 69 | "no-output-rename": true, 70 | "use-life-cycle-interface": true, 71 | "use-pipe-transform-interface": true, 72 | "component-class-suffix": true, 73 | "directive-class-suffix": true 74 | } 75 | } 76 | -------------------------------------------------------------------------------- /ngServer-master/.DS_Store: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Aakashdeveloper/EDU_APR_ANG_MRNG/6dd4be6100bb82d97011392ac966f0126db01702/ngServer-master/.DS_Store -------------------------------------------------------------------------------- /ngServer-master/.gitignore: -------------------------------------------------------------------------------- 1 | /node_modules -------------------------------------------------------------------------------- /ngServer-master/package-lock.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "ngserver", 3 | "version": "1.0.0", 4 | "lockfileVersion": 1, 5 | "requires": true, 6 | "dependencies": { 7 | "formidable": { 8 | "version": "1.2.1", 9 | "resolved": "https://registry.npmjs.org/formidable/-/formidable-1.2.1.tgz", 10 | "integrity": "sha512-Fs9VRguL0gqGHkXS5GQiMCr1VhZBxz0JnJs4JmMp/2jL18Fmbzvv7vOFRU+U8TBkHEE/CX1qDXzJplVULgsLeg==" 11 | } 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /ngServer-master/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "ngserver", 3 | "version": "1.0.0", 4 | "description": "", 5 | "main": "index.js", 6 | "scripts": { 7 | "start": "node server.js", 8 | "test": "echo \"Error: no test specified\" && exit 1" 9 | }, 10 | "author": "aakash", 11 | "license": "ISC", 12 | "dependencies": { 13 | "formidable": "^1.1.1" 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /ngServer-master/server.js: -------------------------------------------------------------------------------- 1 | var http = require('http'); 2 | var formidable = require('formidable'); 3 | var util = require('util'); 4 | 5 | var server = http.createServer(function (req,res){ 6 | console.log("i am running"); 7 | res.setHeader('Access-Control-Allow-Origin','*'); 8 | res.setHeader('Access-Control-Allow-Headers','Origin,X-Requested-With,Content-Type,Accept'); 9 | 10 | if(req.method.toLowerCase() == 'post'){ 11 | processForm(req, res); 12 | return; 13 | } 14 | 15 | res.end(); 16 | }); 17 | 18 | function processForm(req, res){ 19 | var form = new formidable.IncomingForm(); 20 | 21 | form.parse(req, function(err, fields){ 22 | res.writeHead(200, { 23 | 'content-type':'text/plain' 24 | }); 25 | 26 | var data = JSON.stringify({ 27 | fields: fields 28 | }) 29 | res.end(data); 30 | console.log(data); 31 | }); 32 | } 33 | 34 | var port = 3100; 35 | server.listen(port); 36 | console.log("server listen port "+3100) 37 | -------------------------------------------------------------------------------- /reactiveForm/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see https://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /reactiveForm/.gitignore: -------------------------------------------------------------------------------- 1 | # See http://help.github.com/ignore-files/ for more about ignoring files. 2 | 3 | # compiled output 4 | /dist 5 | /tmp 6 | /out-tsc 7 | # Only exists if Bazel was run 8 | /bazel-out 9 | 10 | # dependencies 11 | /node_modules 12 | 13 | # profiling files 14 | chrome-profiler-events.json 15 | speed-measure-plugin.json 16 | 17 | # IDEs and editors 18 | /.idea 19 | .project 20 | .classpath 21 | .c9/ 22 | *.launch 23 | .settings/ 24 | *.sublime-workspace 25 | 26 | # IDE - VSCode 27 | .vscode/* 28 | !.vscode/settings.json 29 | !.vscode/tasks.json 30 | !.vscode/launch.json 31 | !.vscode/extensions.json 32 | .history/* 33 | 34 | # misc 35 | /.sass-cache 36 | /connect.lock 37 | /coverage 38 | /libpeerconnection.log 39 | npm-debug.log 40 | yarn-error.log 41 | testem.log 42 | /typings 43 | 44 | # System Files 45 | .DS_Store 46 | Thumbs.db 47 | -------------------------------------------------------------------------------- /reactiveForm/README.md: -------------------------------------------------------------------------------- 1 | # ReactiveForm 2 | 3 | This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 7.3.6. 4 | 5 | ## Development server 6 | 7 | Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files. 8 | 9 | ## Code scaffolding 10 | 11 | Run `ng generate component component-name` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module`. 12 | 13 | ## Build 14 | 15 | Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory. Use the `--prod` flag for a production build. 16 | 17 | ## Running unit tests 18 | 19 | Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io). 20 | 21 | ## Running end-to-end tests 22 | 23 | Run `ng e2e` to execute the end-to-end tests via [Protractor](http://www.protractortest.org/). 24 | 25 | ## Further help 26 | 27 | To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI README](https://github.com/angular/angular-cli/blob/master/README.md). 28 | -------------------------------------------------------------------------------- /reactiveForm/angular.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "./node_modules/@angular/cli/lib/config/schema.json", 3 | "version": 1, 4 | "newProjectRoot": "projects", 5 | "projects": { 6 | "reactiveForm": { 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/reactiveForm", 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 | "es5BrowserSupport": true 30 | }, 31 | "configurations": { 32 | "production": { 33 | "fileReplacements": [ 34 | { 35 | "replace": "src/environments/environment.ts", 36 | "with": "src/environments/environment.prod.ts" 37 | } 38 | ], 39 | "optimization": true, 40 | "outputHashing": "all", 41 | "sourceMap": false, 42 | "extractCss": true, 43 | "namedChunks": false, 44 | "aot": true, 45 | "extractLicenses": true, 46 | "vendorChunk": false, 47 | "buildOptimizer": true, 48 | "budgets": [ 49 | { 50 | "type": "initial", 51 | "maximumWarning": "2mb", 52 | "maximumError": "5mb" 53 | } 54 | ] 55 | } 56 | } 57 | }, 58 | "serve": { 59 | "builder": "@angular-devkit/build-angular:dev-server", 60 | "options": { 61 | "browserTarget": "reactiveForm:build" 62 | }, 63 | "configurations": { 64 | "production": { 65 | "browserTarget": "reactiveForm:build:production" 66 | } 67 | } 68 | }, 69 | "extract-i18n": { 70 | "builder": "@angular-devkit/build-angular:extract-i18n", 71 | "options": { 72 | "browserTarget": "reactiveForm:build" 73 | } 74 | }, 75 | "test": { 76 | "builder": "@angular-devkit/build-angular:karma", 77 | "options": { 78 | "main": "src/test.ts", 79 | "polyfills": "src/polyfills.ts", 80 | "tsConfig": "src/tsconfig.spec.json", 81 | "karmaConfig": "src/karma.conf.js", 82 | "styles": [ 83 | "src/styles.css" 84 | ], 85 | "scripts": [], 86 | "assets": [ 87 | "src/favicon.ico", 88 | "src/assets" 89 | ] 90 | } 91 | }, 92 | "lint": { 93 | "builder": "@angular-devkit/build-angular:tslint", 94 | "options": { 95 | "tsConfig": [ 96 | "src/tsconfig.app.json", 97 | "src/tsconfig.spec.json" 98 | ], 99 | "exclude": [ 100 | "**/node_modules/**" 101 | ] 102 | } 103 | } 104 | } 105 | }, 106 | "reactiveForm-e2e": { 107 | "root": "e2e/", 108 | "projectType": "application", 109 | "prefix": "", 110 | "architect": { 111 | "e2e": { 112 | "builder": "@angular-devkit/build-angular:protractor", 113 | "options": { 114 | "protractorConfig": "e2e/protractor.conf.js", 115 | "devServerTarget": "reactiveForm:serve" 116 | }, 117 | "configurations": { 118 | "production": { 119 | "devServerTarget": "reactiveForm:serve:production" 120 | } 121 | } 122 | }, 123 | "lint": { 124 | "builder": "@angular-devkit/build-angular:tslint", 125 | "options": { 126 | "tsConfig": "e2e/tsconfig.e2e.json", 127 | "exclude": [ 128 | "**/node_modules/**" 129 | ] 130 | } 131 | } 132 | } 133 | } 134 | }, 135 | "defaultProject": "reactiveForm" 136 | } -------------------------------------------------------------------------------- /reactiveForm/e2e/protractor.conf.js: -------------------------------------------------------------------------------- 1 | // Protractor configuration file, see link for more information 2 | // https://github.com/angular/protractor/blob/master/lib/config.ts 3 | 4 | const { SpecReporter } = require('jasmine-spec-reporter'); 5 | 6 | exports.config = { 7 | allScriptsTimeout: 11000, 8 | specs: [ 9 | './src/**/*.e2e-spec.ts' 10 | ], 11 | capabilities: { 12 | 'browserName': 'chrome' 13 | }, 14 | directConnect: true, 15 | baseUrl: 'http://localhost:4200/', 16 | framework: 'jasmine', 17 | jasmineNodeOpts: { 18 | showColors: true, 19 | defaultTimeoutInterval: 30000, 20 | print: function() {} 21 | }, 22 | onPrepare() { 23 | require('ts-node').register({ 24 | project: require('path').join(__dirname, './tsconfig.e2e.json') 25 | }); 26 | jasmine.getEnv().addReporter(new SpecReporter({ spec: { displayStacktrace: true } })); 27 | } 28 | }; -------------------------------------------------------------------------------- /reactiveForm/e2e/src/app.e2e-spec.ts: -------------------------------------------------------------------------------- 1 | import { AppPage } from './app.po'; 2 | import { browser, logging } from 'protractor'; 3 | 4 | describe('workspace-project App', () => { 5 | let page: AppPage; 6 | 7 | beforeEach(() => { 8 | page = new AppPage(); 9 | }); 10 | 11 | it('should display welcome message', () => { 12 | page.navigateTo(); 13 | expect(page.getTitleText()).toEqual('Welcome to reactiveForm!'); 14 | }); 15 | 16 | afterEach(async () => { 17 | // Assert that there are no errors emitted from the browser 18 | const logs = await browser.manage().logs().get(logging.Type.BROWSER); 19 | expect(logs).not.toContain(jasmine.objectContaining({ 20 | level: logging.Level.SEVERE, 21 | } as logging.Entry)); 22 | }); 23 | }); 24 | -------------------------------------------------------------------------------- /reactiveForm/e2e/src/app.po.ts: -------------------------------------------------------------------------------- 1 | import { browser, by, element } from 'protractor'; 2 | 3 | export class AppPage { 4 | navigateTo() { 5 | return browser.get(browser.baseUrl) as Promise; 6 | } 7 | 8 | getTitleText() { 9 | return element(by.css('app-root h1')).getText() as Promise; 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /reactiveForm/e2e/tsconfig.e2e.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "module": "commonjs", 6 | "target": "es5", 7 | "types": [ 8 | "jasmine", 9 | "jasminewd2", 10 | "node" 11 | ] 12 | } 13 | } -------------------------------------------------------------------------------- /reactiveForm/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "reactive-form", 3 | "version": "0.0.0", 4 | "scripts": { 5 | "ng": "ng", 6 | "start": "ng serve", 7 | "build": "ng build", 8 | "test": "ng test", 9 | "lint": "ng lint", 10 | "e2e": "ng e2e" 11 | }, 12 | "private": true, 13 | "dependencies": { 14 | "@angular/animations": "~7.2.0", 15 | "@angular/common": "~7.2.0", 16 | "@angular/compiler": "~7.2.0", 17 | "@angular/core": "~7.2.0", 18 | "@angular/forms": "~7.2.0", 19 | "@angular/platform-browser": "~7.2.0", 20 | "@angular/platform-browser-dynamic": "~7.2.0", 21 | "@angular/router": "~7.2.0", 22 | "core-js": "^2.5.4", 23 | "rxjs": "~6.3.3", 24 | "tslib": "^1.9.0", 25 | "zone.js": "~0.8.26" 26 | }, 27 | "devDependencies": { 28 | "@angular-devkit/build-angular": "~0.13.0", 29 | "@angular/cli": "~7.3.6", 30 | "@angular/compiler-cli": "~7.2.0", 31 | "@angular/language-service": "~7.2.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": "~4.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.2.2" 47 | } 48 | } 49 | -------------------------------------------------------------------------------- /reactiveForm/src/app/app-routing.module.ts: -------------------------------------------------------------------------------- 1 | import { NgModule } from '@angular/core'; 2 | import { Routes, RouterModule } from '@angular/router'; 3 | 4 | const routes: Routes = []; 5 | 6 | @NgModule({ 7 | imports: [RouterModule.forRoot(routes)], 8 | exports: [RouterModule] 9 | }) 10 | export class AppRoutingModule { } 11 | -------------------------------------------------------------------------------- /reactiveForm/src/app/app.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Aakashdeveloper/EDU_APR_ANG_MRNG/6dd4be6100bb82d97011392ac966f0126db01702/reactiveForm/src/app/app.component.css -------------------------------------------------------------------------------- /reactiveForm/src/app/app.component.html: -------------------------------------------------------------------------------- 1 | 2 |
3 |
4 | 5 |
6 | -------------------------------------------------------------------------------- /reactiveForm/src/app/app.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { TestBed, async } from '@angular/core/testing'; 2 | import { RouterTestingModule } from '@angular/router/testing'; 3 | import { AppComponent } from './app.component'; 4 | 5 | describe('AppComponent', () => { 6 | beforeEach(async(() => { 7 | TestBed.configureTestingModule({ 8 | imports: [ 9 | RouterTestingModule 10 | ], 11 | declarations: [ 12 | AppComponent 13 | ], 14 | }).compileComponents(); 15 | })); 16 | 17 | it('should create the app', () => { 18 | const fixture = TestBed.createComponent(AppComponent); 19 | const app = fixture.debugElement.componentInstance; 20 | expect(app).toBeTruthy(); 21 | }); 22 | 23 | it(`should have as title 'reactiveForm'`, () => { 24 | const fixture = TestBed.createComponent(AppComponent); 25 | const app = fixture.debugElement.componentInstance; 26 | expect(app.title).toEqual('reactiveForm'); 27 | }); 28 | 29 | it('should render title in a h1 tag', () => { 30 | const fixture = TestBed.createComponent(AppComponent); 31 | fixture.detectChanges(); 32 | const compiled = fixture.debugElement.nativeElement; 33 | expect(compiled.querySelector('h1').textContent).toContain('Welcome to reactiveForm!'); 34 | }); 35 | }); 36 | -------------------------------------------------------------------------------- /reactiveForm/src/app/app.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-root', 5 | templateUrl: './app.component.html', 6 | styleUrls: ['./app.component.css'] 7 | }) 8 | export class AppComponent { 9 | title = 'reactiveForm'; 10 | } 11 | -------------------------------------------------------------------------------- /reactiveForm/src/app/app.module.ts: -------------------------------------------------------------------------------- 1 | import { BrowserModule } from '@angular/platform-browser'; 2 | import { NgModule } from '@angular/core'; 3 | import { ReactiveFormsModule} from '@angular/forms'; 4 | 5 | import { AppRoutingModule } from './app-routing.module'; 6 | import { AppComponent } from './app.component'; 7 | import { EmployeeComponent } from './employee/employe.component'; 8 | 9 | 10 | @NgModule({ 11 | declarations: [ 12 | AppComponent, 13 | EmployeeComponent 14 | ], 15 | imports: [ 16 | BrowserModule, 17 | AppRoutingModule, 18 | ReactiveFormsModule 19 | ], 20 | providers: [], 21 | bootstrap: [AppComponent] 22 | }) 23 | export class AppModule { } 24 | -------------------------------------------------------------------------------- /reactiveForm/src/app/employee/employe.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { FormGroup, FormBuilder, Validators, 3 | AbstractControl } from '@angular/forms'; 4 | 5 | function ratingRange(min: number, max: number) { 6 | return(c: AbstractControl): {[key: string]: boolean} | null => { 7 | if (c.value !== undefined && (isNaN(c.value) || c.value < min || c.value > max)) { 8 | return {range: true}; 9 | } 10 | return null; 11 | }; 12 | } 13 | 14 | @Component({ 15 | selector: 'app-emp', 16 | templateUrl: './employee.component.html' 17 | }) 18 | 19 | 20 | 21 | export class EmployeeComponent implements OnInit { 22 | 23 | employeeForm: FormGroup; 24 | constructor(private fb: FormBuilder) {} 25 | 26 | ngOnInit() { 27 | this.employeeForm = this.fb.group({ 28 | firstName: ['Grev', [Validators.required, Validators.minLength(3)]], 29 | email: ['a@a', [Validators.required, 30 | Validators.pattern('[a-zA-Z0-9]+@[a-zA-Z0-9]')]], 31 | password: [12345, [Validators.required, Validators.minLength(5)]], 32 | rating: ['3', [Validators.required, ratingRange(1, 5)]], 33 | phone: [''], 34 | notification: '' 35 | }); 36 | } 37 | 38 | setNotification(notifyVia: string): void { 39 | const phoneControl = this.employeeForm.get('phone'); 40 | if (notifyVia === 'phone') { 41 | phoneControl.setValidators(Validators.required); 42 | } else { 43 | phoneControl.clearValidators(); 44 | } 45 | 46 | phoneControl.updateValueAndValidity(); 47 | } 48 | 49 | 50 | save(): void { 51 | 52 | } 53 | } 54 | -------------------------------------------------------------------------------- /reactiveForm/src/assets/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Aakashdeveloper/EDU_APR_ANG_MRNG/6dd4be6100bb82d97011392ac966f0126db01702/reactiveForm/src/assets/.gitkeep -------------------------------------------------------------------------------- /reactiveForm/src/browserslist: -------------------------------------------------------------------------------- 1 | # This file is currently used by autoprefixer to adjust CSS to support the below specified browsers 2 | # For additional information regarding the format and rule options, please see: 3 | # https://github.com/browserslist/browserslist#queries 4 | # 5 | # For IE 9-11 support, please remove 'not' from the last line of the file and adjust as needed 6 | 7 | > 0.5% 8 | last 2 versions 9 | Firefox ESR 10 | not dead 11 | not IE 9-11 -------------------------------------------------------------------------------- /reactiveForm/src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true 3 | }; 4 | -------------------------------------------------------------------------------- /reactiveForm/src/environments/environment.ts: -------------------------------------------------------------------------------- 1 | // This file can be replaced during build by using the `fileReplacements` array. 2 | // `ng build --prod` replaces `environment.ts` with `environment.prod.ts`. 3 | // The list of file replacements can be found in `angular.json`. 4 | 5 | export const environment = { 6 | production: false 7 | }; 8 | 9 | /* 10 | * For easier debugging in development mode, you can import the following file 11 | * to ignore zone related error stack frames such as `zone.run`, `zoneDelegate.invokeTask`. 12 | * 13 | * This import should be commented out in production mode because it will have a negative impact 14 | * on performance if an error is thrown. 15 | */ 16 | // import 'zone.js/dist/zone-error'; // Included with Angular CLI. 17 | -------------------------------------------------------------------------------- /reactiveForm/src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Aakashdeveloper/EDU_APR_ANG_MRNG/6dd4be6100bb82d97011392ac966f0126db01702/reactiveForm/src/favicon.ico -------------------------------------------------------------------------------- /reactiveForm/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | ReactiveForm 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 | 17 |
18 | 19 | 20 | -------------------------------------------------------------------------------- /reactiveForm/src/karma.conf.js: -------------------------------------------------------------------------------- 1 | // Karma configuration file, see link for more information 2 | // https://karma-runner.github.io/1.0/config/configuration-file.html 3 | 4 | module.exports = function (config) { 5 | config.set({ 6 | basePath: '', 7 | frameworks: ['jasmine', '@angular-devkit/build-angular'], 8 | plugins: [ 9 | require('karma-jasmine'), 10 | require('karma-chrome-launcher'), 11 | require('karma-jasmine-html-reporter'), 12 | require('karma-coverage-istanbul-reporter'), 13 | require('@angular-devkit/build-angular/plugins/karma') 14 | ], 15 | client: { 16 | clearContext: false // leave Jasmine Spec Runner output visible in browser 17 | }, 18 | coverageIstanbulReporter: { 19 | dir: require('path').join(__dirname, '../coverage/reactiveForm'), 20 | reports: ['html', 'lcovonly', 'text-summary'], 21 | fixWebpackSourcePaths: true 22 | }, 23 | reporters: ['progress', 'kjhtml'], 24 | port: 9876, 25 | colors: true, 26 | logLevel: config.LOG_INFO, 27 | autoWatch: true, 28 | browsers: ['Chrome'], 29 | singleRun: false, 30 | restartOnFileChange: true 31 | }); 32 | }; 33 | -------------------------------------------------------------------------------- /reactiveForm/src/main.ts: -------------------------------------------------------------------------------- 1 | import { enableProdMode } from '@angular/core'; 2 | import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; 3 | 4 | import { AppModule } from './app/app.module'; 5 | import { environment } from './environments/environment'; 6 | 7 | if (environment.production) { 8 | enableProdMode(); 9 | } 10 | 11 | platformBrowserDynamic().bootstrapModule(AppModule) 12 | .catch(err => console.error(err)); 13 | -------------------------------------------------------------------------------- /reactiveForm/src/polyfills.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * This file includes polyfills needed by Angular and is loaded before the app. 3 | * You can add your own extra polyfills to this file. 4 | * 5 | * This file is divided into 2 sections: 6 | * 1. Browser polyfills. These are applied before loading ZoneJS and are sorted by browsers. 7 | * 2. Application imports. Files imported after ZoneJS that should be loaded before your main 8 | * file. 9 | * 10 | * The current setup is for so-called "evergreen" browsers; the last versions of browsers that 11 | * automatically update themselves. This includes Safari >= 10, Chrome >= 55 (including Opera), 12 | * Edge >= 13 on the desktop, and iOS 10 and Chrome on mobile. 13 | * 14 | * Learn more in https://angular.io/guide/browser-support 15 | */ 16 | 17 | /*************************************************************************************************** 18 | * BROWSER POLYFILLS 19 | */ 20 | 21 | /** IE10 and IE11 requires the following for NgClass support on SVG elements */ 22 | // import 'classlist.js'; // Run `npm install --save classlist.js`. 23 | 24 | /** 25 | * Web Animations `@angular/platform-browser/animations` 26 | * Only required if AnimationBuilder is used within the application and using IE/Edge or Safari. 27 | * Standard animation support in Angular DOES NOT require any polyfills (as of Angular 6.0). 28 | */ 29 | // import 'web-animations-js'; // Run `npm install --save web-animations-js`. 30 | 31 | /** 32 | * By default, zone.js will patch all possible macroTask and DomEvents 33 | * user can disable parts of macroTask/DomEvents patch by setting following flags 34 | * because those flags need to be set before `zone.js` being loaded, and webpack 35 | * will put import in the top of bundle, so user need to create a separate file 36 | * in this directory (for example: zone-flags.ts), and put the following flags 37 | * into that file, and then add the following code before importing zone.js. 38 | * import './zone-flags.ts'; 39 | * 40 | * The flags allowed in zone-flags.ts are listed here. 41 | * 42 | * The following flags will work for all browsers. 43 | * 44 | * (window as any).__Zone_disable_requestAnimationFrame = true; // disable patch requestAnimationFrame 45 | * (window as any).__Zone_disable_on_property = true; // disable patch onProperty such as onclick 46 | * (window as any).__zone_symbol__BLACK_LISTED_EVENTS = ['scroll', 'mousemove']; // disable patch specified eventNames 47 | * 48 | * in IE/Edge developer tools, the addEventListener will also be wrapped by zone.js 49 | * with the following flag, it will bypass `zone.js` patch for IE/Edge 50 | * 51 | * (window as any).__Zone_enable_cross_context_check = true; 52 | * 53 | */ 54 | 55 | /*************************************************************************************************** 56 | * Zone JS is required by default for Angular itself. 57 | */ 58 | import 'zone.js/dist/zone'; // Included with Angular CLI. 59 | 60 | 61 | /*************************************************************************************************** 62 | * APPLICATION IMPORTS 63 | */ 64 | -------------------------------------------------------------------------------- /reactiveForm/src/styles.css: -------------------------------------------------------------------------------- 1 | /* You can add global styles to this file, and also import other style files */ 2 | -------------------------------------------------------------------------------- /reactiveForm/src/test.ts: -------------------------------------------------------------------------------- 1 | // This file is required by karma.conf.js and loads recursively all the .spec and framework files 2 | 3 | import 'zone.js/dist/zone-testing'; 4 | import { getTestBed } from '@angular/core/testing'; 5 | import { 6 | BrowserDynamicTestingModule, 7 | platformBrowserDynamicTesting 8 | } from '@angular/platform-browser-dynamic/testing'; 9 | 10 | declare const require: any; 11 | 12 | // First, initialize the Angular testing environment. 13 | getTestBed().initTestEnvironment( 14 | BrowserDynamicTestingModule, 15 | platformBrowserDynamicTesting() 16 | ); 17 | // Then we find all the tests. 18 | const context = require.context('./', true, /\.spec\.ts$/); 19 | // And load the modules. 20 | context.keys().map(context); 21 | -------------------------------------------------------------------------------- /reactiveForm/src/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "types": [] 6 | }, 7 | "exclude": [ 8 | "test.ts", 9 | "**/*.spec.ts" 10 | ] 11 | } 12 | -------------------------------------------------------------------------------- /reactiveForm/src/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/spec", 5 | "types": [ 6 | "jasmine", 7 | "node" 8 | ] 9 | }, 10 | "files": [ 11 | "test.ts", 12 | "polyfills.ts" 13 | ], 14 | "include": [ 15 | "**/*.spec.ts", 16 | "**/*.d.ts" 17 | ] 18 | } 19 | -------------------------------------------------------------------------------- /reactiveForm/src/tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tslint.json", 3 | "rules": { 4 | "directive-selector": [ 5 | true, 6 | "attribute", 7 | "app", 8 | "camelCase" 9 | ], 10 | "component-selector": [ 11 | true, 12 | "element", 13 | "app", 14 | "kebab-case" 15 | ] 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /reactiveForm/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compileOnSave": false, 3 | "compilerOptions": { 4 | "baseUrl": "./", 5 | "outDir": "./dist/out-tsc", 6 | "sourceMap": true, 7 | "declaration": false, 8 | "module": "es2015", 9 | "moduleResolution": "node", 10 | "emitDecoratorMetadata": true, 11 | "experimentalDecorators": true, 12 | "importHelpers": true, 13 | "target": "es5", 14 | "typeRoots": [ 15 | "node_modules/@types" 16 | ], 17 | "lib": [ 18 | "es2018", 19 | "dom" 20 | ] 21 | } 22 | } 23 | -------------------------------------------------------------------------------- /reactiveForm/tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "tslint:recommended", 3 | "rulesDirectory": [ 4 | "codelyzer" 5 | ], 6 | "rules": { 7 | "array-type": false, 8 | "arrow-parens": false, 9 | "deprecation": { 10 | "severity": "warn" 11 | }, 12 | "import-blacklist": [ 13 | true, 14 | "rxjs/Rx" 15 | ], 16 | "interface-name": false, 17 | "max-classes-per-file": false, 18 | "max-line-length": [ 19 | true, 20 | 140 21 | ], 22 | "member-access": false, 23 | "member-ordering": [ 24 | true, 25 | { 26 | "order": [ 27 | "static-field", 28 | "instance-field", 29 | "static-method", 30 | "instance-method" 31 | ] 32 | } 33 | ], 34 | "no-consecutive-blank-lines": false, 35 | "no-console": [ 36 | true, 37 | "debug", 38 | "info", 39 | "time", 40 | "timeEnd", 41 | "trace" 42 | ], 43 | "no-empty": false, 44 | "no-inferrable-types": [ 45 | true, 46 | "ignore-params" 47 | ], 48 | "no-non-null-assertion": true, 49 | "no-redundant-jsdoc": true, 50 | "no-switch-case-fall-through": true, 51 | "no-use-before-declare": true, 52 | "no-var-requires": false, 53 | "object-literal-key-quotes": [ 54 | true, 55 | "as-needed" 56 | ], 57 | "object-literal-sort-keys": false, 58 | "ordered-imports": false, 59 | "quotemark": [ 60 | true, 61 | "single" 62 | ], 63 | "trailing-comma": false, 64 | "no-output-on-prefix": true, 65 | "use-input-property-decorator": true, 66 | "use-output-property-decorator": true, 67 | "use-host-property-decorator": true, 68 | "no-input-rename": true, 69 | "no-output-rename": true, 70 | "use-life-cycle-interface": true, 71 | "use-pipe-transform-interface": true, 72 | "component-class-suffix": true, 73 | "directive-class-suffix": true 74 | } 75 | } 76 | -------------------------------------------------------------------------------- /templateForm/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see https://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /templateForm/.gitignore: -------------------------------------------------------------------------------- 1 | # See http://help.github.com/ignore-files/ for more about ignoring files. 2 | 3 | # compiled output 4 | /dist 5 | /tmp 6 | /out-tsc 7 | # Only exists if Bazel was run 8 | /bazel-out 9 | 10 | # dependencies 11 | /node_modules 12 | 13 | # profiling files 14 | chrome-profiler-events.json 15 | speed-measure-plugin.json 16 | 17 | # IDEs and editors 18 | /.idea 19 | .project 20 | .classpath 21 | .c9/ 22 | *.launch 23 | .settings/ 24 | *.sublime-workspace 25 | 26 | # IDE - VSCode 27 | .vscode/* 28 | !.vscode/settings.json 29 | !.vscode/tasks.json 30 | !.vscode/launch.json 31 | !.vscode/extensions.json 32 | .history/* 33 | 34 | # misc 35 | /.sass-cache 36 | /connect.lock 37 | /coverage 38 | /libpeerconnection.log 39 | npm-debug.log 40 | yarn-error.log 41 | testem.log 42 | /typings 43 | 44 | # System Files 45 | .DS_Store 46 | Thumbs.db 47 | -------------------------------------------------------------------------------- /templateForm/README.md: -------------------------------------------------------------------------------- 1 | # TemplateForm 2 | 3 | This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 7.3.6. 4 | 5 | ## Development server 6 | 7 | Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files. 8 | 9 | ## Code scaffolding 10 | 11 | Run `ng generate component component-name` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module`. 12 | 13 | ## Build 14 | 15 | Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory. Use the `--prod` flag for a production build. 16 | 17 | ## Running unit tests 18 | 19 | Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io). 20 | 21 | ## Running end-to-end tests 22 | 23 | Run `ng e2e` to execute the end-to-end tests via [Protractor](http://www.protractortest.org/). 24 | 25 | ## Further help 26 | 27 | To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI README](https://github.com/angular/angular-cli/blob/master/README.md). 28 | -------------------------------------------------------------------------------- /templateForm/angular.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "./node_modules/@angular/cli/lib/config/schema.json", 3 | "version": 1, 4 | "newProjectRoot": "projects", 5 | "projects": { 6 | "templateForm": { 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/templateForm", 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 | "es5BrowserSupport": true 30 | }, 31 | "configurations": { 32 | "production": { 33 | "fileReplacements": [ 34 | { 35 | "replace": "src/environments/environment.ts", 36 | "with": "src/environments/environment.prod.ts" 37 | } 38 | ], 39 | "optimization": true, 40 | "outputHashing": "all", 41 | "sourceMap": false, 42 | "extractCss": true, 43 | "namedChunks": false, 44 | "aot": true, 45 | "extractLicenses": true, 46 | "vendorChunk": false, 47 | "buildOptimizer": true, 48 | "budgets": [ 49 | { 50 | "type": "initial", 51 | "maximumWarning": "2mb", 52 | "maximumError": "5mb" 53 | } 54 | ] 55 | } 56 | } 57 | }, 58 | "serve": { 59 | "builder": "@angular-devkit/build-angular:dev-server", 60 | "options": { 61 | "browserTarget": "templateForm:build" 62 | }, 63 | "configurations": { 64 | "production": { 65 | "browserTarget": "templateForm:build:production" 66 | } 67 | } 68 | }, 69 | "extract-i18n": { 70 | "builder": "@angular-devkit/build-angular:extract-i18n", 71 | "options": { 72 | "browserTarget": "templateForm:build" 73 | } 74 | }, 75 | "test": { 76 | "builder": "@angular-devkit/build-angular:karma", 77 | "options": { 78 | "main": "src/test.ts", 79 | "polyfills": "src/polyfills.ts", 80 | "tsConfig": "src/tsconfig.spec.json", 81 | "karmaConfig": "src/karma.conf.js", 82 | "styles": [ 83 | "src/styles.css" 84 | ], 85 | "scripts": [], 86 | "assets": [ 87 | "src/favicon.ico", 88 | "src/assets" 89 | ] 90 | } 91 | }, 92 | "lint": { 93 | "builder": "@angular-devkit/build-angular:tslint", 94 | "options": { 95 | "tsConfig": [ 96 | "src/tsconfig.app.json", 97 | "src/tsconfig.spec.json" 98 | ], 99 | "exclude": [ 100 | "**/node_modules/**" 101 | ] 102 | } 103 | } 104 | } 105 | }, 106 | "templateForm-e2e": { 107 | "root": "e2e/", 108 | "projectType": "application", 109 | "prefix": "", 110 | "architect": { 111 | "e2e": { 112 | "builder": "@angular-devkit/build-angular:protractor", 113 | "options": { 114 | "protractorConfig": "e2e/protractor.conf.js", 115 | "devServerTarget": "templateForm:serve" 116 | }, 117 | "configurations": { 118 | "production": { 119 | "devServerTarget": "templateForm:serve:production" 120 | } 121 | } 122 | }, 123 | "lint": { 124 | "builder": "@angular-devkit/build-angular:tslint", 125 | "options": { 126 | "tsConfig": "e2e/tsconfig.e2e.json", 127 | "exclude": [ 128 | "**/node_modules/**" 129 | ] 130 | } 131 | } 132 | } 133 | } 134 | }, 135 | "defaultProject": "templateForm" 136 | } -------------------------------------------------------------------------------- /templateForm/e2e/protractor.conf.js: -------------------------------------------------------------------------------- 1 | // Protractor configuration file, see link for more information 2 | // https://github.com/angular/protractor/blob/master/lib/config.ts 3 | 4 | const { SpecReporter } = require('jasmine-spec-reporter'); 5 | 6 | exports.config = { 7 | allScriptsTimeout: 11000, 8 | specs: [ 9 | './src/**/*.e2e-spec.ts' 10 | ], 11 | capabilities: { 12 | 'browserName': 'chrome' 13 | }, 14 | directConnect: true, 15 | baseUrl: 'http://localhost:4200/', 16 | framework: 'jasmine', 17 | jasmineNodeOpts: { 18 | showColors: true, 19 | defaultTimeoutInterval: 30000, 20 | print: function() {} 21 | }, 22 | onPrepare() { 23 | require('ts-node').register({ 24 | project: require('path').join(__dirname, './tsconfig.e2e.json') 25 | }); 26 | jasmine.getEnv().addReporter(new SpecReporter({ spec: { displayStacktrace: true } })); 27 | } 28 | }; -------------------------------------------------------------------------------- /templateForm/e2e/src/app.e2e-spec.ts: -------------------------------------------------------------------------------- 1 | import { AppPage } from './app.po'; 2 | import { browser, logging } from 'protractor'; 3 | 4 | describe('workspace-project App', () => { 5 | let page: AppPage; 6 | 7 | beforeEach(() => { 8 | page = new AppPage(); 9 | }); 10 | 11 | it('should display welcome message', () => { 12 | page.navigateTo(); 13 | expect(page.getTitleText()).toEqual('Welcome to templateForm!'); 14 | }); 15 | 16 | afterEach(async () => { 17 | // Assert that there are no errors emitted from the browser 18 | const logs = await browser.manage().logs().get(logging.Type.BROWSER); 19 | expect(logs).not.toContain(jasmine.objectContaining({ 20 | level: logging.Level.SEVERE, 21 | } as logging.Entry)); 22 | }); 23 | }); 24 | -------------------------------------------------------------------------------- /templateForm/e2e/src/app.po.ts: -------------------------------------------------------------------------------- 1 | import { browser, by, element } from 'protractor'; 2 | 3 | export class AppPage { 4 | navigateTo() { 5 | return browser.get(browser.baseUrl) as Promise; 6 | } 7 | 8 | getTitleText() { 9 | return element(by.css('app-root h1')).getText() as Promise; 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /templateForm/e2e/tsconfig.e2e.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "module": "commonjs", 6 | "target": "es5", 7 | "types": [ 8 | "jasmine", 9 | "jasminewd2", 10 | "node" 11 | ] 12 | } 13 | } -------------------------------------------------------------------------------- /templateForm/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "template-form", 3 | "version": "0.0.0", 4 | "scripts": { 5 | "ng": "ng", 6 | "start": "ng serve", 7 | "build": "ng build", 8 | "test": "ng test", 9 | "lint": "ng lint", 10 | "e2e": "ng e2e" 11 | }, 12 | "private": true, 13 | "dependencies": { 14 | "@angular/animations": "~7.2.0", 15 | "@angular/common": "~7.2.0", 16 | "@angular/compiler": "~7.2.0", 17 | "@angular/core": "~7.2.0", 18 | "@angular/forms": "~7.2.0", 19 | "@angular/platform-browser": "~7.2.0", 20 | "@angular/platform-browser-dynamic": "~7.2.0", 21 | "@angular/router": "~7.2.0", 22 | "core-js": "^2.5.4", 23 | "rxjs": "~6.3.3", 24 | "tslib": "^1.9.0", 25 | "zone.js": "~0.8.26" 26 | }, 27 | "devDependencies": { 28 | "@angular-devkit/build-angular": "~0.13.0", 29 | "@angular/cli": "~7.3.6", 30 | "@angular/compiler-cli": "~7.2.0", 31 | "@angular/language-service": "~7.2.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": "~4.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.2.2" 47 | } 48 | } 49 | -------------------------------------------------------------------------------- /templateForm/src/app/app-routing.module.ts: -------------------------------------------------------------------------------- 1 | import { NgModule } from '@angular/core'; 2 | import { Routes, RouterModule } from '@angular/router'; 3 | 4 | const routes: Routes = []; 5 | 6 | @NgModule({ 7 | imports: [RouterModule.forRoot(routes)], 8 | exports: [RouterModule] 9 | }) 10 | export class AppRoutingModule { } 11 | -------------------------------------------------------------------------------- /templateForm/src/app/app.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Aakashdeveloper/EDU_APR_ANG_MRNG/6dd4be6100bb82d97011392ac966f0126db01702/templateForm/src/app/app.component.css -------------------------------------------------------------------------------- /templateForm/src/app/app.component.html: -------------------------------------------------------------------------------- 1 | 2 |
3 |
4 | 5 |
6 | -------------------------------------------------------------------------------- /templateForm/src/app/app.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { TestBed, async } from '@angular/core/testing'; 2 | import { RouterTestingModule } from '@angular/router/testing'; 3 | import { AppComponent } from './app.component'; 4 | 5 | describe('AppComponent', () => { 6 | beforeEach(async(() => { 7 | TestBed.configureTestingModule({ 8 | imports: [ 9 | RouterTestingModule 10 | ], 11 | declarations: [ 12 | AppComponent 13 | ], 14 | }).compileComponents(); 15 | })); 16 | 17 | it('should create the app', () => { 18 | const fixture = TestBed.createComponent(AppComponent); 19 | const app = fixture.debugElement.componentInstance; 20 | expect(app).toBeTruthy(); 21 | }); 22 | 23 | it(`should have as title 'templateForm'`, () => { 24 | const fixture = TestBed.createComponent(AppComponent); 25 | const app = fixture.debugElement.componentInstance; 26 | expect(app.title).toEqual('templateForm'); 27 | }); 28 | 29 | it('should render title in a h1 tag', () => { 30 | const fixture = TestBed.createComponent(AppComponent); 31 | fixture.detectChanges(); 32 | const compiled = fixture.debugElement.nativeElement; 33 | expect(compiled.querySelector('h1').textContent).toContain('Welcome to templateForm!'); 34 | }); 35 | }); 36 | -------------------------------------------------------------------------------- /templateForm/src/app/app.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-root', 5 | templateUrl: './app.component.html', 6 | styleUrls: ['./app.component.css'] 7 | }) 8 | export class AppComponent { 9 | title = 'templateForm'; 10 | } 11 | -------------------------------------------------------------------------------- /templateForm/src/app/app.module.ts: -------------------------------------------------------------------------------- 1 | import { BrowserModule } from '@angular/platform-browser'; 2 | import { NgModule } from '@angular/core'; 3 | import { FormsModule } from '@angular/forms'; 4 | import { HttpClientModule } from '@angular/common/http'; 5 | 6 | import { AppRoutingModule } from './app-routing.module'; 7 | import { AppComponent } from './app.component'; 8 | import { CustomerFormComponent } from './customer-form/customer-form.component'; 9 | import { FormPosterService } from './services/form-poster.service'; 10 | 11 | @NgModule({ 12 | declarations: [ 13 | AppComponent, 14 | CustomerFormComponent 15 | ], 16 | imports: [ 17 | BrowserModule, 18 | AppRoutingModule, 19 | HttpClientModule, 20 | FormsModule 21 | ], 22 | providers: [ 23 | FormPosterService 24 | ], 25 | bootstrap: [AppComponent] 26 | }) 27 | export class AppModule { } 28 | -------------------------------------------------------------------------------- /templateForm/src/app/customer-form/customer-form.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | import { CutsomerModal } from '../models/CustomerModal'; 3 | import { NgForm } from '@angular/forms'; 4 | import { FormPosterService } from '../services/form-poster.service'; 5 | 6 | @Component({ 7 | selector: 'app-cust', 8 | templateUrl: './customer-form.component.html' 9 | }) 10 | 11 | 12 | export class CustomerFormComponent { 13 | languages: any[] = ['AI', 'ML', 'DataScience', 'AWS', 'GCP']; 14 | mymodel = new CutsomerModal('John', 'Eva', 'j@gmail.com', '12345678', true, 'male', 'AI'); 15 | 16 | hasCodeLangError: boolean = false; 17 | 18 | constructor(private formPosterService: FormPosterService) {} 19 | 20 | firstToUpper(value: string): void { 21 | if (value.length > 0) { 22 | this.mymodel.firstname = value.charAt(0).toUpperCase(); 23 | } else { 24 | this.mymodel.firstname = value; 25 | } 26 | } 27 | 28 | validateCodeLang(event): void { 29 | if (this.mymodel.codelang === 'default') { 30 | this.hasCodeLangError = true; 31 | } else { 32 | this.hasCodeLangError = false; 33 | } 34 | } 35 | 36 | submitForm(form: NgForm): void { 37 | // console.log('>>>>FormData<<<<', form.value); 38 | this.formPosterService.postCustomer(form.value) 39 | .subscribe((res) => console.log('data posted')); 40 | } 41 | 42 | } 43 | -------------------------------------------------------------------------------- /templateForm/src/app/models/CustomerModal.ts: -------------------------------------------------------------------------------- 1 | export class CutsomerModal { 2 | constructor( 3 | public firstname: string, 4 | public lastname: string, 5 | public email: string, 6 | public password: string, 7 | public fulltime: boolean, 8 | public gender: string, 9 | public codelang: string 10 | ) {} 11 | } 12 | -------------------------------------------------------------------------------- /templateForm/src/app/services/form-poster.service.ts: -------------------------------------------------------------------------------- 1 | import { Injectable } from '@angular/core'; 2 | import { CutsomerModal } from '../models/CustomerModal'; 3 | import { HttpClient } from '@angular/common/http'; 4 | import { Observable } from 'rxjs'; 5 | 6 | @Injectable() 7 | 8 | export class FormPosterService { 9 | 10 | private url = 'http://localhost:3100/postEmployee'; 11 | 12 | constructor(private http: HttpClient) {} 13 | 14 | postCustomer( customer: CutsomerModal) { 15 | console.log('>>>>Data in service ', customer); 16 | return this.http.post(this.url, customer ); 17 | } 18 | } 19 | -------------------------------------------------------------------------------- /templateForm/src/assets/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Aakashdeveloper/EDU_APR_ANG_MRNG/6dd4be6100bb82d97011392ac966f0126db01702/templateForm/src/assets/.gitkeep -------------------------------------------------------------------------------- /templateForm/src/browserslist: -------------------------------------------------------------------------------- 1 | # This file is currently used by autoprefixer to adjust CSS to support the below specified browsers 2 | # For additional information regarding the format and rule options, please see: 3 | # https://github.com/browserslist/browserslist#queries 4 | # 5 | # For IE 9-11 support, please remove 'not' from the last line of the file and adjust as needed 6 | 7 | > 0.5% 8 | last 2 versions 9 | Firefox ESR 10 | not dead 11 | not IE 9-11 -------------------------------------------------------------------------------- /templateForm/src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true 3 | }; 4 | -------------------------------------------------------------------------------- /templateForm/src/environments/environment.ts: -------------------------------------------------------------------------------- 1 | // This file can be replaced during build by using the `fileReplacements` array. 2 | // `ng build --prod` replaces `environment.ts` with `environment.prod.ts`. 3 | // The list of file replacements can be found in `angular.json`. 4 | 5 | export const environment = { 6 | production: false 7 | }; 8 | 9 | /* 10 | * For easier debugging in development mode, you can import the following file 11 | * to ignore zone related error stack frames such as `zone.run`, `zoneDelegate.invokeTask`. 12 | * 13 | * This import should be commented out in production mode because it will have a negative impact 14 | * on performance if an error is thrown. 15 | */ 16 | // import 'zone.js/dist/zone-error'; // Included with Angular CLI. 17 | -------------------------------------------------------------------------------- /templateForm/src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Aakashdeveloper/EDU_APR_ANG_MRNG/6dd4be6100bb82d97011392ac966f0126db01702/templateForm/src/favicon.ico -------------------------------------------------------------------------------- /templateForm/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | TemplateForm 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 | 17 |
18 | 19 | 20 | -------------------------------------------------------------------------------- /templateForm/src/karma.conf.js: -------------------------------------------------------------------------------- 1 | // Karma configuration file, see link for more information 2 | // https://karma-runner.github.io/1.0/config/configuration-file.html 3 | 4 | module.exports = function (config) { 5 | config.set({ 6 | basePath: '', 7 | frameworks: ['jasmine', '@angular-devkit/build-angular'], 8 | plugins: [ 9 | require('karma-jasmine'), 10 | require('karma-chrome-launcher'), 11 | require('karma-jasmine-html-reporter'), 12 | require('karma-coverage-istanbul-reporter'), 13 | require('@angular-devkit/build-angular/plugins/karma') 14 | ], 15 | client: { 16 | clearContext: false // leave Jasmine Spec Runner output visible in browser 17 | }, 18 | coverageIstanbulReporter: { 19 | dir: require('path').join(__dirname, '../coverage/templateForm'), 20 | reports: ['html', 'lcovonly', 'text-summary'], 21 | fixWebpackSourcePaths: true 22 | }, 23 | reporters: ['progress', 'kjhtml'], 24 | port: 9876, 25 | colors: true, 26 | logLevel: config.LOG_INFO, 27 | autoWatch: true, 28 | browsers: ['Chrome'], 29 | singleRun: false, 30 | restartOnFileChange: true 31 | }); 32 | }; 33 | -------------------------------------------------------------------------------- /templateForm/src/main.ts: -------------------------------------------------------------------------------- 1 | import { enableProdMode } from '@angular/core'; 2 | import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; 3 | 4 | import { AppModule } from './app/app.module'; 5 | import { environment } from './environments/environment'; 6 | 7 | if (environment.production) { 8 | enableProdMode(); 9 | } 10 | 11 | platformBrowserDynamic().bootstrapModule(AppModule) 12 | .catch(err => console.error(err)); 13 | -------------------------------------------------------------------------------- /templateForm/src/polyfills.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * This file includes polyfills needed by Angular and is loaded before the app. 3 | * You can add your own extra polyfills to this file. 4 | * 5 | * This file is divided into 2 sections: 6 | * 1. Browser polyfills. These are applied before loading ZoneJS and are sorted by browsers. 7 | * 2. Application imports. Files imported after ZoneJS that should be loaded before your main 8 | * file. 9 | * 10 | * The current setup is for so-called "evergreen" browsers; the last versions of browsers that 11 | * automatically update themselves. This includes Safari >= 10, Chrome >= 55 (including Opera), 12 | * Edge >= 13 on the desktop, and iOS 10 and Chrome on mobile. 13 | * 14 | * Learn more in https://angular.io/guide/browser-support 15 | */ 16 | 17 | /*************************************************************************************************** 18 | * BROWSER POLYFILLS 19 | */ 20 | 21 | /** IE10 and IE11 requires the following for NgClass support on SVG elements */ 22 | // import 'classlist.js'; // Run `npm install --save classlist.js`. 23 | 24 | /** 25 | * Web Animations `@angular/platform-browser/animations` 26 | * Only required if AnimationBuilder is used within the application and using IE/Edge or Safari. 27 | * Standard animation support in Angular DOES NOT require any polyfills (as of Angular 6.0). 28 | */ 29 | // import 'web-animations-js'; // Run `npm install --save web-animations-js`. 30 | 31 | /** 32 | * By default, zone.js will patch all possible macroTask and DomEvents 33 | * user can disable parts of macroTask/DomEvents patch by setting following flags 34 | * because those flags need to be set before `zone.js` being loaded, and webpack 35 | * will put import in the top of bundle, so user need to create a separate file 36 | * in this directory (for example: zone-flags.ts), and put the following flags 37 | * into that file, and then add the following code before importing zone.js. 38 | * import './zone-flags.ts'; 39 | * 40 | * The flags allowed in zone-flags.ts are listed here. 41 | * 42 | * The following flags will work for all browsers. 43 | * 44 | * (window as any).__Zone_disable_requestAnimationFrame = true; // disable patch requestAnimationFrame 45 | * (window as any).__Zone_disable_on_property = true; // disable patch onProperty such as onclick 46 | * (window as any).__zone_symbol__BLACK_LISTED_EVENTS = ['scroll', 'mousemove']; // disable patch specified eventNames 47 | * 48 | * in IE/Edge developer tools, the addEventListener will also be wrapped by zone.js 49 | * with the following flag, it will bypass `zone.js` patch for IE/Edge 50 | * 51 | * (window as any).__Zone_enable_cross_context_check = true; 52 | * 53 | */ 54 | 55 | /*************************************************************************************************** 56 | * Zone JS is required by default for Angular itself. 57 | */ 58 | import 'zone.js/dist/zone'; // Included with Angular CLI. 59 | 60 | 61 | /*************************************************************************************************** 62 | * APPLICATION IMPORTS 63 | */ 64 | -------------------------------------------------------------------------------- /templateForm/src/styles.css: -------------------------------------------------------------------------------- 1 | /* You can add global styles to this file, and also import other style files */ 2 | -------------------------------------------------------------------------------- /templateForm/src/test.ts: -------------------------------------------------------------------------------- 1 | // This file is required by karma.conf.js and loads recursively all the .spec and framework files 2 | 3 | import 'zone.js/dist/zone-testing'; 4 | import { getTestBed } from '@angular/core/testing'; 5 | import { 6 | BrowserDynamicTestingModule, 7 | platformBrowserDynamicTesting 8 | } from '@angular/platform-browser-dynamic/testing'; 9 | 10 | declare const require: any; 11 | 12 | // First, initialize the Angular testing environment. 13 | getTestBed().initTestEnvironment( 14 | BrowserDynamicTestingModule, 15 | platformBrowserDynamicTesting() 16 | ); 17 | // Then we find all the tests. 18 | const context = require.context('./', true, /\.spec\.ts$/); 19 | // And load the modules. 20 | context.keys().map(context); 21 | -------------------------------------------------------------------------------- /templateForm/src/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "types": [] 6 | }, 7 | "exclude": [ 8 | "test.ts", 9 | "**/*.spec.ts" 10 | ] 11 | } 12 | -------------------------------------------------------------------------------- /templateForm/src/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/spec", 5 | "types": [ 6 | "jasmine", 7 | "node" 8 | ] 9 | }, 10 | "files": [ 11 | "test.ts", 12 | "polyfills.ts" 13 | ], 14 | "include": [ 15 | "**/*.spec.ts", 16 | "**/*.d.ts" 17 | ] 18 | } 19 | -------------------------------------------------------------------------------- /templateForm/src/tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tslint.json", 3 | "rules": { 4 | "directive-selector": [ 5 | true, 6 | "attribute", 7 | "app", 8 | "camelCase" 9 | ], 10 | "component-selector": [ 11 | true, 12 | "element", 13 | "app", 14 | "kebab-case" 15 | ] 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /templateForm/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compileOnSave": false, 3 | "compilerOptions": { 4 | "baseUrl": "./", 5 | "outDir": "./dist/out-tsc", 6 | "sourceMap": true, 7 | "declaration": false, 8 | "module": "es2015", 9 | "moduleResolution": "node", 10 | "emitDecoratorMetadata": true, 11 | "experimentalDecorators": true, 12 | "importHelpers": true, 13 | "target": "es5", 14 | "typeRoots": [ 15 | "node_modules/@types" 16 | ], 17 | "lib": [ 18 | "es2018", 19 | "dom" 20 | ] 21 | } 22 | } 23 | -------------------------------------------------------------------------------- /templateForm/tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "tslint:recommended", 3 | "rulesDirectory": [ 4 | "codelyzer" 5 | ], 6 | "rules": { 7 | "array-type": false, 8 | "arrow-parens": false, 9 | "deprecation": { 10 | "severity": "warn" 11 | }, 12 | "import-blacklist": [ 13 | true, 14 | "rxjs/Rx" 15 | ], 16 | "interface-name": false, 17 | "max-classes-per-file": false, 18 | "max-line-length": [ 19 | true, 20 | 140 21 | ], 22 | "member-access": false, 23 | "member-ordering": [ 24 | true, 25 | { 26 | "order": [ 27 | "static-field", 28 | "instance-field", 29 | "static-method", 30 | "instance-method" 31 | ] 32 | } 33 | ], 34 | "no-consecutive-blank-lines": false, 35 | "no-console": [ 36 | true, 37 | "debug", 38 | "info", 39 | "time", 40 | "timeEnd", 41 | "trace" 42 | ], 43 | "no-empty": false, 44 | "no-inferrable-types": [ 45 | true, 46 | "ignore-params" 47 | ], 48 | "no-non-null-assertion": true, 49 | "no-redundant-jsdoc": true, 50 | "no-switch-case-fall-through": true, 51 | "no-use-before-declare": true, 52 | "no-var-requires": false, 53 | "object-literal-key-quotes": [ 54 | true, 55 | "as-needed" 56 | ], 57 | "object-literal-sort-keys": false, 58 | "ordered-imports": false, 59 | "quotemark": [ 60 | true, 61 | "single" 62 | ], 63 | "trailing-comma": false, 64 | "no-output-on-prefix": true, 65 | "use-input-property-decorator": true, 66 | "use-output-property-decorator": true, 67 | "use-host-property-decorator": true, 68 | "no-input-rename": true, 69 | "no-output-rename": true, 70 | "use-life-cycle-interface": true, 71 | "use-pipe-transform-interface": true, 72 | "component-class-suffix": true, 73 | "directive-class-suffix": true 74 | } 75 | } 76 | --------------------------------------------------------------------------------