Welcome Guest! (App Version 5.16)
IntroductionSPA Technology Angular Framework Prerequisites Basic Requirements TypeScript Angular-CLI Creating a new Project
Module-Directive-BindingModules Directives Types of Directives Element Directives Components Creating New Component Component Comm @Input @Output Attribute Directives [ngStyle] [ngClass] [ngSwitch] Structural Directives *ngIf *ngFor *ngSwitchCase *ngSwitchDefault Data-Binding Types of Data-Binding String Interpolation Property Binding Event Binding 2 Way Data Binding
Services-Routing-FormsServices Creating a new Service Getting data via Service RxJS $http and Observables Rest API hit Interface Routing Setting up Routes Forms Types of Forms Template-Driven Forms Reactive Forms
Decorators-Pipes-etcDecorators Pipes Life Cycle Hooks Dependency Injection Providers Interceptors
Unit-Testing & AnimationUnit-Testing Animation
Build and DeployBuild the Project Deploy on Web
Angular QuizAngular Quiz 1
The best way to create a component in Angular is by making use of
Angular-CLI. This tool helps a lot while developing angular projects. By entering the code as follows you will generate a component.
> ng generate component component/home
> ng g c component/home
Note that here we are generating a component named 'home' inside a folder named component, which is a good practise. We could have simply written name of the component without setting it inside folder named 'component' but then it would be more messy and folder would be created directly inside 'app' folder. This would look ugly as later when more items would be generated like various services, models, pipes, then all these items (in absense of separate folder for each of them) would seem mixed among themselves inside app folder. Keeping separate folders for components, services, models, pipes, etc. would keep things organized.