└── ngApp ├── .angular-cli.json ├── .editorconfig ├── .gitignore ├── README.md ├── e2e ├── app.e2e-spec.ts ├── app.po.ts └── tsconfig.e2e.json ├── karma.conf.js ├── package.json ├── protractor.conf.js ├── server.js ├── server ├── models │ └── video.js └── routes │ └── api.js ├── src ├── app │ ├── app-routing.module.ts │ ├── app.component.css │ ├── app.component.html │ ├── app.component.spec.ts │ ├── app.component.ts │ ├── app.module.ts │ ├── home │ │ ├── home.component.css │ │ ├── home.component.html │ │ ├── home.component.spec.ts │ │ └── home.component.ts │ ├── safe.pipe.spec.ts │ ├── safe.pipe.ts │ ├── video-center │ │ ├── video-center.component.css │ │ ├── video-center.component.html │ │ ├── video-center.component.spec.ts │ │ └── video-center.component.ts │ ├── video-detail │ │ ├── video-detail.component.css │ │ ├── video-detail.component.html │ │ ├── video-detail.component.spec.ts │ │ └── video-detail.component.ts │ ├── video-list │ │ ├── video-list.component.css │ │ ├── video-list.component.html │ │ ├── video-list.component.spec.ts │ │ └── video-list.component.ts │ ├── video.service.spec.ts │ ├── video.service.ts │ └── video.ts ├── assets │ └── .gitkeep ├── environments │ ├── environment.prod.ts │ └── environment.ts ├── favicon.ico ├── index.html ├── main.ts ├── polyfills.ts ├── styles.css ├── test.ts ├── tsconfig.app.json ├── tsconfig.spec.json └── typings.d.ts ├── tsconfig.json └── tslint.json /ngApp/.angular-cli.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "./node_modules/@angular/cli/lib/config/schema.json", 3 | "project": { 4 | "name": "ng-app" 5 | }, 6 | "apps": [ 7 | { 8 | "root": "src", 9 | "outDir": "dist", 10 | "assets": [ 11 | "assets", 12 | "favicon.ico" 13 | ], 14 | "index": "index.html", 15 | "main": "main.ts", 16 | "polyfills": "polyfills.ts", 17 | "test": "test.ts", 18 | "tsconfig": "tsconfig.app.json", 19 | "testTsconfig": "tsconfig.spec.json", 20 | "prefix": "app", 21 | "styles": [ 22 | "styles.css", 23 | "../node_modules/bootstrap/dist/css/bootstrap.min.css" 24 | ], 25 | "scripts": [], 26 | "environmentSource": "environments/environment.ts", 27 | "environments": { 28 | "dev": "environments/environment.ts", 29 | "prod": "environments/environment.prod.ts" 30 | } 31 | } 32 | ], 33 | "e2e": { 34 | "protractor": { 35 | "config": "./protractor.conf.js" 36 | } 37 | }, 38 | "lint": [ 39 | { 40 | "project": "src/tsconfig.app.json" 41 | }, 42 | { 43 | "project": "src/tsconfig.spec.json" 44 | }, 45 | { 46 | "project": "e2e/tsconfig.e2e.json" 47 | } 48 | ], 49 | "test": { 50 | "karma": { 51 | "config": "./karma.conf.js" 52 | } 53 | }, 54 | "defaults": { 55 | "styleExt": "css", 56 | "component": {} 57 | } 58 | } 59 | -------------------------------------------------------------------------------- /ngApp/.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 | -------------------------------------------------------------------------------- /ngApp/.gitignore: -------------------------------------------------------------------------------- 1 | # See http://help.github.com/ignore-files/ for more about ignoring files. 2 | 3 | # compiled output 4 | /dist 5 | /tmp 6 | 7 | # dependencies 8 | /node_modules 9 | 10 | # IDEs and editors 11 | /.idea 12 | .project 13 | .classpath 14 | .c9/ 15 | *.launch 16 | .settings/ 17 | *.sublime-workspace 18 | 19 | # IDE - VSCode 20 | .vscode/* 21 | !.vscode/settings.json 22 | !.vscode/tasks.json 23 | !.vscode/launch.json 24 | !.vscode/extensions.json 25 | 26 | # misc 27 | /.sass-cache 28 | /connect.lock 29 | /coverage/* 30 | /libpeerconnection.log 31 | npm-debug.log 32 | testem.log 33 | /typings 34 | 35 | # e2e 36 | /e2e/*.js 37 | /e2e/*.map 38 | 39 | #System Files 40 | .DS_Store 41 | Thumbs.db 42 | -------------------------------------------------------------------------------- /ngApp/README.md: -------------------------------------------------------------------------------- 1 | # NgApp 2 | 3 | This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 1.0.0-rc.1. 4 | 5 | ## Development server 6 | 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. 7 | 8 | ## Code scaffolding 9 | 10 | Run `ng generate component component-name` to generate a new component. You can also use `ng generate directive/pipe/service/class/module`. 11 | 12 | ## Build 13 | 14 | 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. 15 | 16 | ## Running unit tests 17 | 18 | Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io). 19 | 20 | ## Running end-to-end tests 21 | 22 | Run `ng e2e` to execute the end-to-end tests via [Protractor](http://www.protractortest.org/). 23 | Before running the tests make sure you are serving the app via `ng serve`. 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 | -------------------------------------------------------------------------------- /ngApp/e2e/app.e2e-spec.ts: -------------------------------------------------------------------------------- 1 | import { NgAppPage } from './app.po'; 2 | 3 | describe('ng-app App', () => { 4 | let page: NgAppPage; 5 | 6 | beforeEach(() => { 7 | page = new NgAppPage(); 8 | }); 9 | 10 | it('should display message saying app works', () => { 11 | page.navigateTo(); 12 | expect(page.getParagraphText()).toEqual('app works!'); 13 | }); 14 | }); 15 | -------------------------------------------------------------------------------- /ngApp/e2e/app.po.ts: -------------------------------------------------------------------------------- 1 | import { browser, element, by } from 'protractor'; 2 | 3 | export class NgAppPage { 4 | navigateTo() { 5 | return browser.get('/'); 6 | } 7 | 8 | getParagraphText() { 9 | return element(by.css('app-root h1')).getText(); 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /ngApp/e2e/tsconfig.e2e.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "sourceMap": true, 4 | "declaration": false, 5 | "moduleResolution": "node", 6 | "emitDecoratorMetadata": true, 7 | "experimentalDecorators": true, 8 | "lib": [ 9 | "es2016" 10 | ], 11 | "outDir": "../dist/out-tsc-e2e", 12 | "module": "commonjs", 13 | "target": "es6", 14 | "types":[ 15 | "jasmine", 16 | "node" 17 | ] 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /ngApp/karma.conf.js: -------------------------------------------------------------------------------- 1 | // Karma configuration file, see link for more information 2 | // https://karma-runner.github.io/0.13/config/configuration-file.html 3 | 4 | module.exports = function (config) { 5 | config.set({ 6 | basePath: '', 7 | frameworks: ['jasmine', '@angular/cli'], 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/cli/plugins/karma') 14 | ], 15 | client:{ 16 | clearContext: false // leave Jasmine Spec Runner output visible in browser 17 | }, 18 | files: [ 19 | { pattern: './src/test.ts', watched: false } 20 | ], 21 | preprocessors: { 22 | './src/test.ts': ['@angular/cli'] 23 | }, 24 | mime: { 25 | 'text/x-typescript': ['ts','tsx'] 26 | }, 27 | coverageIstanbulReporter: { 28 | reports: [ 'html', 'lcovonly' ], 29 | fixWebpackSourcePaths: true 30 | }, 31 | angularCli: { 32 | environment: 'dev' 33 | }, 34 | reporters: config.angularCli && config.angularCli.codeCoverage 35 | ? ['progress', 'coverage-istanbul'] 36 | : ['progress', 'kjhtml'], 37 | port: 9876, 38 | colors: true, 39 | logLevel: config.LOG_INFO, 40 | autoWatch: true, 41 | browsers: ['Chrome'], 42 | singleRun: false 43 | }); 44 | }; 45 | -------------------------------------------------------------------------------- /ngApp/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "ng-app", 3 | "version": "0.0.0", 4 | "license": "MIT", 5 | "scripts": { 6 | "ng": "ng", 7 | "start": "ng serve", 8 | "build": "ng build", 9 | "test": "ng test", 10 | "lint": "ng lint", 11 | "e2e": "ng e2e" 12 | }, 13 | "private": true, 14 | "dependencies": { 15 | "@angular/common": "^2.4.0", 16 | "@angular/compiler": "^2.4.0", 17 | "@angular/core": "^2.4.0", 18 | "@angular/forms": "^2.4.0", 19 | "@angular/http": "^2.4.0", 20 | "@angular/platform-browser": "^2.4.0", 21 | "@angular/platform-browser-dynamic": "^2.4.0", 22 | "@angular/router": "^3.4.0", 23 | "body-parser": "^1.17.1", 24 | "bootstrap": "^3.3.7", 25 | "core-js": "^2.4.1", 26 | "express": "^4.15.2", 27 | "mongoose": "^4.9.3", 28 | "rxjs": "^5.1.0", 29 | "zone.js": "^0.7.6" 30 | }, 31 | "devDependencies": { 32 | "@angular/cli": "1.0.0-rc.1", 33 | "@angular/compiler-cli": "^2.4.0", 34 | "@types/jasmine": "2.5.38", 35 | "@types/node": "~6.0.60", 36 | "codelyzer": "~2.0.0", 37 | "jasmine-core": "~2.5.2", 38 | "jasmine-spec-reporter": "~3.2.0", 39 | "karma": "~1.4.1", 40 | "karma-chrome-launcher": "~2.0.0", 41 | "karma-cli": "~1.0.1", 42 | "karma-jasmine": "~1.1.0", 43 | "karma-jasmine-html-reporter": "^0.2.2", 44 | "karma-coverage-istanbul-reporter": "^0.2.0", 45 | "protractor": "~5.1.0", 46 | "ts-node": "~2.0.0", 47 | "tslint": "~4.4.2", 48 | "typescript": "~2.0.0" 49 | } 50 | } 51 | -------------------------------------------------------------------------------- /ngApp/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 | }, 14 | directConnect: true, 15 | baseUrl: 'http://localhost:4200/', 16 | framework: 'jasmine', 17 | jasmineNodeOpts: { 18 | showColors: true, 19 | defaultTimeoutInterval: 30000, 20 | print: function() {} 21 | }, 22 | beforeLaunch: function() { 23 | require('ts-node').register({ 24 | project: 'e2e/tsconfig.e2e.json' 25 | }); 26 | }, 27 | onPrepare() { 28 | jasmine.getEnv().addReporter(new SpecReporter({ spec: { displayStacktrace: true } })); 29 | } 30 | }; 31 | -------------------------------------------------------------------------------- /ngApp/server.js: -------------------------------------------------------------------------------- 1 | const express = require('express'); 2 | const bodyParser = require('body-parser'); 3 | const path = require('path'); 4 | 5 | const api = require('./server/routes/api'); 6 | const port = 3000; 7 | 8 | const app = express(); 9 | app.use(express.static(path.join(__dirname, 'dist'))); 10 | 11 | app.use(bodyParser.urlencoded({extended: true})); 12 | app.use(bodyParser.json()); 13 | 14 | app.use('/api', api); 15 | 16 | app.get('*', (req, res) => { 17 | res.sendFile(path.join(__dirname, 'dist/index.html')); 18 | }); 19 | 20 | app.listen(port, function(){ 21 | console.log("Server running on localhost:" + port); 22 | }); -------------------------------------------------------------------------------- /ngApp/server/models/video.js: -------------------------------------------------------------------------------- 1 | const mongoose = require('mongoose'); 2 | 3 | const Schema = mongoose.Schema; 4 | 5 | const videoSchema = new Schema({ 6 | title: String, 7 | url: String, 8 | description: String 9 | }); 10 | 11 | module.exports = mongoose.model('video', videoSchema, 'videos'); -------------------------------------------------------------------------------- /ngApp/server/routes/api.js: -------------------------------------------------------------------------------- 1 | const express = require('express'); 2 | const router = express.Router(); 3 | const mongoose = require('mongoose'); 4 | const Video = require('../models/video'); 5 | 6 | const db = "mongodb://uservishwas:dbpwvishwas1@ds147920.mlab.com:47920/videoplayer"; 7 | mongoose.Promise = global.Promise; 8 | mongoose.connect(db, function(err){ 9 | if(err){ 10 | console.error("Error! " + err); 11 | } 12 | }); 13 | 14 | router.get('/videos', function(req, res){ 15 | console.log('Get request for all videos'); 16 | Video.find({}) 17 | .exec(function(err, videos){ 18 | if (err){ 19 | console.log("Error retrieving videos"); 20 | }else { 21 | res.json(videos); 22 | } 23 | }); 24 | }); 25 | 26 | router.get('/videos/:id', function(req, res){ 27 | console.log('Get request for a single video'); 28 | Video.findById(req.params.id) 29 | .exec(function(err, video){ 30 | if (err){ 31 | console.log("Error retrieving video"); 32 | }else { 33 | res.json(video); 34 | } 35 | }); 36 | }); 37 | 38 | router.post('/video', function(req, res){ 39 | console.log('Post a video'); 40 | var newVideo = new Video(); 41 | newVideo.title = req.body.title; 42 | newVideo.url = req.body.url; 43 | newVideo.description = req.body.description; 44 | newVideo.save(function(err, insertedVideo){ 45 | if (err){ 46 | console.log('Error saving video'); 47 | }else{ 48 | res.json(insertedVideo); 49 | } 50 | }); 51 | }); 52 | 53 | 54 | router.put('/video/:id', function(req, res){ 55 | console.log('Update a video'); 56 | Video.findByIdAndUpdate(req.params.id, 57 | { 58 | $set: {title: req.body.title, url: req.body.url, description: req.body.description} 59 | }, 60 | { 61 | new: true 62 | }, 63 | function(err, updatedVideo){ 64 | if(err){ 65 | res.send("Error updating video"); 66 | }else{ 67 | res.json(updatedVideo); 68 | } 69 | } 70 | 71 | ); 72 | }); 73 | 74 | 75 | router.delete('/video/:id', function(req, res){ 76 | console.log('Deleting a video'); 77 | Video.findByIdAndRemove(req.params.id, function(err, deletedVideo){ 78 | if(err){ 79 | res.send("Error deleting video"); 80 | }else{ 81 | res.json(deletedVideo); 82 | } 83 | }); 84 | }); 85 | 86 | module.exports = router; -------------------------------------------------------------------------------- /ngApp/src/app/app-routing.module.ts: -------------------------------------------------------------------------------- 1 | import { NgModule } from '@angular/core'; 2 | import { Routes, RouterModule } from '@angular/router'; 3 | import { HomeComponent } from "./home/home.component"; 4 | import { VideoCenterComponent } from "./video-center/video-center.component"; 5 | 6 | const routes: Routes = [ 7 | {path: '', redirectTo:'/home', pathMatch:'full'}, 8 | {path: 'home', component: HomeComponent}, 9 | {path: 'videos', component: VideoCenterComponent} 10 | ]; 11 | 12 | @NgModule({ 13 | imports: [RouterModule.forRoot(routes)], 14 | exports: [RouterModule], 15 | providers: [] 16 | }) 17 | export class AppRoutingModule { } 18 | -------------------------------------------------------------------------------- /ngApp/src/app/app.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gopinav/MEAN-Stack-Angular-CLI-/b6f0c25aa6bf70eb9e97db494f2bb6fb74b99e01/ngApp/src/app/app.component.css -------------------------------------------------------------------------------- /ngApp/src/app/app.component.html: -------------------------------------------------------------------------------- 1 | 12 |
13 | 14 |
15 | -------------------------------------------------------------------------------- /ngApp/src/app/app.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { TestBed, async } from '@angular/core/testing'; 2 | import { RouterTestingModule } from '@angular/router/testing'; 3 | 4 | import { AppComponent } from './app.component'; 5 | 6 | describe('AppComponent', () => { 7 | beforeEach(async(() => { 8 | TestBed.configureTestingModule({ 9 | imports: [ 10 | RouterTestingModule 11 | ], 12 | declarations: [ 13 | AppComponent 14 | ], 15 | }).compileComponents(); 16 | })); 17 | 18 | it('should create the app', async(() => { 19 | const fixture = TestBed.createComponent(AppComponent); 20 | const app = fixture.debugElement.componentInstance; 21 | expect(app).toBeTruthy(); 22 | })); 23 | 24 | it(`should have as title 'app works!'`, async(() => { 25 | const fixture = TestBed.createComponent(AppComponent); 26 | const app = fixture.debugElement.componentInstance; 27 | expect(app.title).toEqual('app works!'); 28 | })); 29 | 30 | it('should render title in a h1 tag', async(() => { 31 | const fixture = TestBed.createComponent(AppComponent); 32 | fixture.detectChanges(); 33 | const compiled = fixture.debugElement.nativeElement; 34 | expect(compiled.querySelector('h1').textContent).toContain('app works!'); 35 | })); 36 | }); 37 | -------------------------------------------------------------------------------- /ngApp/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 = 'app works!'; 10 | } 11 | -------------------------------------------------------------------------------- /ngApp/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 { HttpModule } from '@angular/http'; 5 | 6 | import { AppRoutingModule } from './app-routing.module'; 7 | import { AppComponent } from './app.component'; 8 | import { HomeComponent } from './home/home.component'; 9 | import { VideoCenterComponent } from './video-center/video-center.component'; 10 | import { VideoListComponent } from './video-list/video-list.component'; 11 | import { VideoDetailComponent } from './video-detail/video-detail.component'; 12 | import { SafePipe } from './safe.pipe'; 13 | 14 | @NgModule({ 15 | declarations: [ 16 | AppComponent, 17 | HomeComponent, 18 | VideoCenterComponent, 19 | VideoListComponent, 20 | VideoDetailComponent, 21 | SafePipe 22 | ], 23 | imports: [ 24 | BrowserModule, 25 | FormsModule, 26 | HttpModule, 27 | AppRoutingModule 28 | ], 29 | providers: [], 30 | bootstrap: [AppComponent] 31 | }) 32 | export class AppModule { } 33 | -------------------------------------------------------------------------------- /ngApp/src/app/home/home.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gopinav/MEAN-Stack-Angular-CLI-/b6f0c25aa6bf70eb9e97db494f2bb6fb74b99e01/ngApp/src/app/home/home.component.css -------------------------------------------------------------------------------- /ngApp/src/app/home/home.component.html: -------------------------------------------------------------------------------- 1 |
2 |

{{title}}

3 |
-------------------------------------------------------------------------------- /ngApp/src/app/home/home.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { async, ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { HomeComponent } from './home.component'; 4 | 5 | describe('HomeComponent', () => { 6 | let component: HomeComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async(() => { 10 | TestBed.configureTestingModule({ 11 | declarations: [ HomeComponent ] 12 | }) 13 | .compileComponents(); 14 | })); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(HomeComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /ngApp/src/app/home/home.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-home', 5 | templateUrl: './home.component.html', 6 | styleUrls: ['./home.component.css'] 7 | }) 8 | export class HomeComponent implements OnInit { 9 | 10 | title: string = "Welcome to VideoPlayer"; 11 | 12 | constructor() { } 13 | 14 | ngOnInit() { 15 | } 16 | 17 | } 18 | -------------------------------------------------------------------------------- /ngApp/src/app/safe.pipe.spec.ts: -------------------------------------------------------------------------------- 1 | import { SafePipe } from './safe.pipe'; 2 | 3 | describe('SafePipe', () => { 4 | it('create an instance', () => { 5 | const pipe = new SafePipe(); 6 | expect(pipe).toBeTruthy(); 7 | }); 8 | }); 9 | -------------------------------------------------------------------------------- /ngApp/src/app/safe.pipe.ts: -------------------------------------------------------------------------------- 1 | import { Pipe, PipeTransform } from '@angular/core'; 2 | import {DomSanitizer} from "@angular/platform-browser"; 3 | 4 | @Pipe({ name: 'safe' }) 5 | export class SafePipe implements PipeTransform { 6 | constructor(private sanitizer: DomSanitizer) {} 7 | transform(url: any) { 8 | return this.sanitizer.bypassSecurityTrustResourceUrl(url); 9 | } 10 | } -------------------------------------------------------------------------------- /ngApp/src/app/video-center/video-center.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gopinav/MEAN-Stack-Angular-CLI-/b6f0c25aa6bf70eb9e97db494f2bb6fb74b99e01/ngApp/src/app/video-center/video-center.component.css -------------------------------------------------------------------------------- /ngApp/src/app/video-center/video-center.component.html: -------------------------------------------------------------------------------- 1 |
2 |
3 |
4 |

New Video

5 |
6 |
7 | 8 | 9 |
10 |
11 | 12 | 13 |
14 |
15 | 16 | 17 |
18 | 19 |
20 |
21 | 25 | 26 |
27 |
28 | 29 | 30 |
31 |
-------------------------------------------------------------------------------- /ngApp/src/app/video-center/video-center.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { async, ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { VideoCenterComponent } from './video-center.component'; 4 | 5 | describe('VideoCenterComponent', () => { 6 | let component: VideoCenterComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async(() => { 10 | TestBed.configureTestingModule({ 11 | declarations: [ VideoCenterComponent ] 12 | }) 13 | .compileComponents(); 14 | })); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(VideoCenterComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /ngApp/src/app/video-center/video-center.component.ts: -------------------------------------------------------------------------------- 1 | import { VideoService } from './../video.service'; 2 | import { Component, OnInit } from '@angular/core'; 3 | import { Video } from "../video"; 4 | @Component({ 5 | selector: 'app-video-center', 6 | templateUrl: './video-center.component.html', 7 | styleUrls: ['./video-center.component.css'], 8 | providers: [VideoService] 9 | }) 10 | export class VideoCenterComponent implements OnInit { 11 | selectedVideo: Video; 12 | private hidenewVideo: boolean = true; 13 | videos: Array