Posts

Showing posts from August, 2019

Directive in Angular || ngFor Angular Fundamentals

Image
In this video,I explained  directive in Angular. Feel free to comment and like the video. For more, please subscribe and press the BELL icon. Please visit my  Angular Playlist . Please visit my  YouTube Videos .   #directive #ngFor #angular The code is as follows - ts file -  import { Component } from '@angular/core'; @Component ({   selector: 'courses',   template: `              <ul start=5>                <li *ngFor= "let course of courses">                {{ course }}                </li>              </ul>   ` }) export class CoursesComponent {   courses = ["HTML", "CSS","JS","PHP","AJS"]; }

Template in Angular || Angular Fundamentals

Image
In this video,I explained  template in Angular. Feel free to comment. For more, please subscribe and press the BELL icon. Please visit my  Angular Playlist . Please visit my  YouTube Videos . The code is as follows - ts file -  import { Component } from '@angular/core'; @Component ({   selector: 'courses',   template: '<h1> {{ "Title is : - " + title}} </h1>  <p>  {{ getDetails() }} </p> {{ "Channel Name is:- " + getName() }}' }) export class CoursesComponent {    title = "List of Subjects";    details = "I Love Angular";    name = "WebGuru";    getDetails() {      return this.details;    }    getName() {      return this.name;    } }

Component in Angular || Angular Fundamentals

Image
In this video,I explained  Component in Angular. Feel free to comment. For more, please subscribe and press the BELL icon. Please visit my  Angular Playlist . Please visit my  YouTube Videos . The code is as follows - courses.component.ts -  import { Component } from '@angular/core'; @Component ({   selector: 'courses',  //CSS Selector   template: '<p> This is my own template </p> <b> <i> Courses </i> </b>' }) export class CoursesComponent { } app.module.ts -  import { CoursesComponent } from './courses.component';    // add this line @NgModule({   declarations: [     AppComponent,     CoursesComponent        // add this line   ], app.component.html -  <h1> Angular Fundamentals </h1> <courses> </courses>

Module in TypeScript || Module Concept

Image
In this video,I explained how to use  module in TypeScript. Feel free to comment. For more, please subscribe and press the BELL icon. Please visit my  Angular Playlist . Please visit my  Angular Videos The code is as follows - module.ts -  import { Point } from './module1'; let point = new Point(30,40); point.draw(); module1.ts -  export class Point {   constructor (private a: number, private b: number) {   }   draw() {     console.log('A: - ' + this.a + ' B:- ' + this.b);   } }

Access Modifiers || Access Modifiers in TypeScript

Image
In this video,I explained how to use  access modifiers in TypeScript. Feel free to comment. For more, please subscribe and press the BELL icon. Please visit my  Angular Playlist . Please visit my  YouTube Videos . The code is as follows - access_modifiers_parameter.ts -  class Point {   constructor (private x: number, private y: number) {}   draw(){     console.log('X: - ' + this.x + ', Y:- ' + this.y);   } } let point = new Point(10,20); point.draw();

Indian Flag || Indian Flag using HTML CSS

Image
In this video,I explained how to create Indian Flag using HTML CSS . Feel free to comment. For more, please subscribe and press the BELL icon. Please visit my  Angular Playlist . Please visit my  YouTube Videos . The code is as follows - HTML File - <html>   <head>      <title> Indian Flag </title>      <link rel="stylesheet" href="flag.css">   </head>   <body>      <div class="flag">     <div class="stripe stripe1"> </div>   <div class="stripe stripe2">      <div class="chakra">     <div class="spoke spoke1"> </div> <div class="spoke spoke2"> </div> <div class="spoke spoke3"> </div> <div class="spoke spoke4"> </div> <div class="spoke spoke5"> </div> <div class="spoke spoke6"> </d

Constructor in TypeScript || String Concatenation Concept

Image
In this video,I explained how to use constructor in TypeScript . Feel free to comment. For more, please subscribe and press the BELL icon. Please visit my  Angular Playlist  . Please visit my  YouTube Videos . The code is as follows - constructor.ts -  class Point {   x: number;   y: number;   constructor (x: number, y: number) {     this.x = x;     this.y = y;   }   draw(){     console.log('The value of X :- ' + this.x + '  The value of Y :- ' + this.y);     console.log('The addition of X & Y :- ' + (this.x + this.y) );   } } let point = new Point(10,20); point.draw();

Class and Object in TypeScript || Using Object in Class

Image
In this video,I explained how to use object in class in TypeScript . Feel free to comment. For more, please subscribe and press the BELL icon. Please visit my  Angular Playlist  . Please visit my  YouTube Video . The code is as follows - object.ts -  class Point {  // Point - class   x: number;   y: number;   draw (){     console.log('X:- ' + this.x + ', Y:- '+ this.y + ', X + Y :- ' + (this.x + this.y) );   } } let point = new Point ;  // point - Object point.x = 50; point.y = 100; point.draw();

Interface in TypeScript || Interface along with Arrow Function

Image
In this video,I explained interface in TypeScript . Feel free to comment. For more, please subscribe and press the BELL icon. Please visit my  Angular Playlist  .Please visit my  YouTube Videos . The code is as follows - interface.ts - interface Chat {   // Chat is the interface name   x: number,   y: number } let doChat = (chat: Chat) => {  // doChat - arrow function   console.log("The value of x:- " + chat.x);          // chat - parameter   console.log("The value of y:- " + chat.y); } doChat({   x: 20,   y: 40 }) interface1.ts -  interface anik {   x: number,   y: number } let singh = (abc: anik) => {   console.log(abc.x);   console.log(abc.y); } singh({   x: 1,   y: 2 })

Exercise on Variable and Arrow Function || Variable and Arrow Function in TypeScript

Image
In this video,I explained a  simple exercise in variable and arrow function concept in TypeScript.  Feel free to comment. For more, please subscribe and press the BELL icon. Please visit my  Angular Playlist . Please visit my  YouTube Videos . The code is as follows -  exercise_variable.ts -  // Create a simple and easy mathematical calculator let p: any; let q: any; p= 30; q= 10; console.log("The Mathematical Calculator :- "); console.log("The addition is: - " + (p+q)); console.log("The substraction is: - " + (p-q)); console.log("The multiplication is: - " + (p*q)); console.log("The division is: - " + (p/q)); console.log("The modulus is: - " + (p%q)); arrow_function.ts -  // arrow function is basically a function, // where we will NOT use the 'function' key // => - symbol let check = (msg) => {    //multiple lines   console.log(msg);   // ....   // ...

Setting Up Environment in PHP || Simple Program in PHP

Image
In this video,I explained how to set up the environment in PHP . Feel free to comment. For more, please subscribe and press the BELL icon. Please visit my  Angular Playlist . Please visit my  YouTube Videos . The code is as follows - simple_program.php - <?php      echo "Hi...!!! This is my first PHP Program";  ?>

Types in TypeScript || Variable Types in TypeScript

Image
In this video,I explained variable types in TypeScript . Feel free to comment. For more, please subscribe and press the BELL icon. Please visit my Angular Playlist . Please visit my YouTube videos . The code is as follows -  type.ts -  let a: number; a = 10; console.log(a); let b: boolean; b = true; console.log(b); let c: string; c = "Hi...!!! Welcome Everyone"; console.log(c); let d: any; d = "Hi"; console.log(d); d = 20; console.log(d); const i = 0; console.log(i); enum Values {V1, V2, V3}; let FirstValues = Values.V1; console.log(FirstValues); let SecondValues = Values.V2; console.log(SecondValues);

Declaring Variable in TypeScript || Variable in TypeScript

Image
In this video,I explained how to declare variable in TypeScript . Feel free to comment. For more, please subscribe and press the BELL icon.  Please visit my  Angular Playlist . Please visit my  YouTube Videos  . The code is as follows - variable.ts -  function varia () {   for(var i = 0; i<5; i++) {     console.log(i);   }   console.log("Finally the value of i :- " + i); } varia();