tkssharma

  <BrowserRouter>
    <div>
      <ul>
        <li><NavLink to="/" activeClassName="active">Home</NavLink></li>
        <li><NavLink to="/basic-routing" activeClassName="active">BasicRouting</NavLink></li>
        <li><NavLink to="/blocking" activeClassName="active">Blocking</NavLink></li>
        <li><NavLink to="/miss" activeClassName="active">Miss</NavLink></li>
        <li><NavLink to="/query-params" activeClassName="active">Query Params</NavLink></li>
        <li><NavLink to="/recursive-paths" activeClassName="active">Recursive Paths</NavLink></li>
      </ul>

tkssharma

import ReactDOM from 'react-dom'
import React from 'react'
import { BrowserRouter, Switch, Route, NavLink } from 'react-router-dom'
import { Home, BasicRouting, Blocking } from './Components'

ReactDOM.render(
  <BrowserRouter>
    <div>
      <ul>
        <li><NavLink to="/" activeClassName="active">Home</NavLink></li>

tkssharma

@Component({
    selector: 'video-list',
    templateUrl: 'video-list.html'
})

 class VideoList implements OnInit {
   @Input() Videos:video[] ;
   ngOnInit(){
     console.log(this.Videos);
   }

tkssharma

  <ng-loader [loaded]="loaded"></ng-loader>
  <search-bar (searchTextChange)="SearchValueChange($event);"></search-bar>
  <div class="container">
    <div class="left">
    <video-detail [selectVideo]="selectVideo"></video-detail>
  </div>
  <div class="right">
    <video-list [Videos]="Videos"></video-list>
  </div>

tkssharma

import { Component, Input, OnInit, Output, EventEmitter } from '@angular/core';

@Component({
selector: 'search-bar', 
template: '<div class="search-bar" > <input [(ngModel)]="searchText" (change)="handleChange()" /></div>'
})

export default class SearchBar implements OnInit {
  @Output() searchTextChange = new EventEmitter();
  searchText: string;

tkssharma

export default class Youtube implements OnInit {
    Videos : video[];
    loaded : boolean;
    API_KEY : string;
    selectVideo : video;
    opts : any;
    constructor() {

    }
    ngOnInit() {

tkssharma

function intersection(firstArray, secondArray) {
 // array1 = [1,5,6,7,8];
 // array2 = [3,4,5,7,9];
  var hashmap = {};
  var intersectionArray = [];
  // assign 1 to all index in hashmap
  firstArray.forEach(function(element) {
    hashmap[element] = 1;
  });

tkssharma

document.addEventListener('DOMContentLoaded', function() {

  let app = document.getElementById('todo-app');

  // attach event listener to whole container
  app.addEventListener('click', function(e) {
    if (e.target && e.target.nodeName === 'LI') {
      let item = e.target;
      alert('you clicked on item: ' + item.innerHTML);
    }

tkssharma

function debouce(fn, delay){
    var timer = null
    return  function(){
    let content = this;
     var args = arguments;
     clearTimeout(timer);
     timer = setTimeout(()=>{
        fn.apply(this,arguments)
     },delay)
  }

tkssharma

function isEquivalent(a, b) {
    // Create arrays of property names
    var aProps = Object.getOwnPropertyNames(a);
    var bProps = Object.getOwnPropertyNames(b);
    // If number of properties is different,
    // objects are not equivalent
    if (aProps.length != bProps.length) {
        return false;
    }
    for (var i = 0; i < aProps.length; i++) {