Wiki

Clone wiki

DevFecta Public Repository / Angular

Enable the NodeSource Repository and Install Node.js

// Install curl if not installed.
sudo apt install curl

// Close Terminal and open a new Terminal window.

// For a specific version change the setup_10.x to the version. Example: setup_12.x
curl -sL https://deb.nodesource.com/setup_10.x | sudo -E bash -

sudo apt install nodejs

node --version
npm --version

// Install Angular globally.
npm install -g @angular/cli

Create a new Angular app

// Hit enter for the default settings.
ng new my-app

cd my-app

code . 

// Must be in the app folder to run this command. This starts the server.
ng serve --open

Add a Dependency to an Angular app

ng add @angular/material <-- dependency name material.angular.io

Recreate the node_modules Directory and Installing Specific Dependencies

npm install <-- Installs all of the module dependencies listed in the package.json file.

npm install @angular/cli <-- Installs a specific module dependency listed in the package.json file.

Angular Directives

  • *ngFor
  • *ngIf
    // Type Inference
    // On a variable
    let x = 1;
    x = "1";
    // window.alert(x);
    
    // On function params and return types
    function foo(a: number /* parameter annotation */, b: number): string /* function return annotation */ {
        return a + b + '2';
    }
    
    // window.alert(foo(1, 3));
    
    let arr = [4, 7, 10, 5, 100];
    
    let max = Math.max(arr[4], arr[2]);
    
    // window.alert(max);
    
    class Bar {
        Cat: string = 'cat';
    }
    
    let cls = new Bar();
    cls.Cat = "Tom";
    window.alert(cls.Cat);
    

Functional JavaScript

// Reduce combines strings or performs math on x and returns the accumulator value
const reduceNumbers = numbers.reduce(
    (accumulator, x) => accumulator + x.toString()
    , '0' // Intitial Value of accumulator
);
.reduceRight()
// Map lets you apply a function to the value of x
const numbersPlusFive = numbers.map(x => x + 5);
.forEach()

// Filter SELECT * WHERE (x % 2) = 0
// Returns an array
const evenNumbers = numbers.filter(x => x % 2 == 0);
.find()

TypeScript

Install TypeScript

npm install -g typescript

Compile TypeScript

tsc <filename>.ts

Run TypeScript File

node <filename>.js

Updated