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
Components are nothing but a kind of directive. They have got their own view file (template or .html file), their own logical file (.ts or typeScript file), their own styling files (.css or .scss files) and their own test-cases file (.spec.ts files). Components are like a complete set of various inter-related pieces and a single entity that can be added to other components to make a complete full-fledged application.
If components are so highly focussed in component-based architecture then there must also be some benefits of it. Otherwise why should we use components in our applications? So, the answer is that components have a very benefitial characteristic which is components are resuable. This means once you make a component for some project, then the very same component can be used for 10 different projects on copying the component files.
The benefit of Component-based Architecture is that the full code of view, logic, styling and test-cases is completely separate in a folder and this folder can be directly copied and placed in some other project. With some minor changes the very same component can be reused saving lots of time and man-hours of developers -- thereby reducing the overall cost of the project.
When we create a component we get a folder with a set of 4 files in general. The files are as follows: