Components
Components control views (html). They also communicate with other components and services to bring functionality to your app.
Component contains :
HTML template or HTML code
Code(TypeScript)
Service: It is a reusable code that is shared by the Components so that rewriting of code is not required
Pipe: It takes in data as input and transforms it to the desired output
Components
You can create the component with following command
ng generate component product
So, when you create a component (for example product), it will create four files
product.component.css
product.component.html
product.component.spec.ts
product.component.ts
In the context of AngularJS and modern web development, a component is a self-contained and reusable building block for building a web application. It is a part of the user interface (UI) that encapsulates the data, behavior, and presentation logic of a specific feature or functionality. Components can be used to create reusable UI elements such as buttons, forms, and dialogs, as well as larger UI sections such as a product catalog, a dashboard, or a search interface.
In AngularJS, a component is defined using the @Component decorator, which allows developers to specify the component's metadata, such as its selector, template, styles, and providers. The component class contains the component's behavior and data, and it can interact with other components and services through dependency injection.
Components promote modularity and code reusability, making it easier to maintain and scale complex web applications. They can be nested and composed together to create more complex UIs, and they can be easily tested in isolation using unit tests. Overall, components are an essential concept in modern web development and are used by many popular front-end frameworks and libraries, including Angular, React, and Vue.js.
Module
Module is like a big container containing one or many small containers called Component, Service, Pipe. Modules consist of one or more components. They do not control any html. Your modules declare which components can be used by components belonging to other modules, which classes will be injected by the dependency injector and which component gets bootstrapped. Modules allow you to manage your components to bring modularity to your app.
Modules
You can create the module with following command
ng g module products --routing
So, when you create a module(for example product), it will create one files
product.module.ts
Top comments (0)