Angular – Directives

There are to types of Directives : Structural: Modify the structure of the DOM Attribute: Modify the attributes of DOM elements 1. ngIf export class AppComponent { courses = [1,2]; courses = []; } //Instinctual version <div *ngIf=”courses.length > 0″> List of courses </div> <div *ngIf=”courses.length == 0″> No courses yet </div> // Better version […]

Angular-Consuming HTTP service

Using the fake server https://jsonplaceholder.typicode.com/ First of all, in order to use http, we need to import HttpModule inside @angular/http import {HttpModule} from ‘@angular/http’; import { Component, OnInit } from ‘@angular/core’; import { Http } from ‘@angular/http’; @Component({ selector: ‘app-post’, templateUrl: ‘./post.component.html’, styleUrls: [‘./post.component.css’] }) export class PostComponent implements OnInit { constructor(http: Http) { http.get(‘https://jsonplaceholder.typicode.com/posts’).subscribe(response […]

Reusable Component

Component API If you want to make your component to be reusable, you should add input and output properties in your component. Just like the button element from HTML itself has “click” property, you can bind the click properties with some methods in your code to respond to users’ operations. In your component, you need to […]