svnshikhil
3/19/2018 - 5:45 AM

Angular getting started

*ngIf,*ngIfThen,*ngFor,* =====> structural directives
or
<div [ngIf]="condition">...</div

{{user.last}} ====> String interpolation


<button (click)="nextUser()">Next user</button


*constructor
This is invoked when Angular creates a component or directive by calling new on the class.

*ngOnChanges
Invoked every time there is a change in one of th input properties of the component.

*ngOnInit
Invoked when given component has been initialized.
This hook is only called once after the first ngOnChanges

*ngDoCheck
Invoked when the change detector of the given component is invoked. It allows us to implement our own change detection algorithm for the given component.

#Important
ngDoCheck and ngOnChanges should not be implemented together on the same component.

*ngOnDestroy
This method will be invoked just before Angular destroys the component.
Use this hook to unsubscribe observables and detach event handlers to avoid memory leaks.

#Hooks for the components children
These hooks are only called for components and not directives.


*ngAfterContentInit
Invoked after Angular performs any content projection into the components view

*ngAfterContentChecked
Invoked each time the content of the given component has been checked by the change detection mechanism of Angular.

*ngAfterViewInit
Invoked when the component’s view has been fully initialized.

*ngAfterViewChecked
Invoked each time the view of the given component has been checked by the change detection mechanism of Angular.



*Interpolation
The format for defining interpolation in a template is - {{ propertyName }}
<input type="submit" class="default" value="{{username}}"

*Property Binding - 
<input type="submit" class="default" [value]="username"

# Interpolation and Property binding is same


*Event binding
 <button (click)="onSubmit();">Login</button
 
*Two way binding
 <input type="text" class="form-control" name="username" [(ngModel)]='model.username' required /