The component is one of the building blocks of the ionic framework. Here we will be creating our own custom component. Components are the class, with HTML template. For our custom component have a decorator that is @Component, to add metadata to a class to describe the component.
- We can create a custom component, that can be used in anywhere. Data in the component are private.
- Component name <person>, in our case. using in home.html page
- Learning *ngIf and else condition
Our Apps we have a custom component with its own variables and template.
Step 1: ionic start MyComponent blank
Step 2: Add the following code in home.html
We will create a custom tag called, is custom tag or component, where toggle on Person Profile will display Student information and toggle off will display lecture information as shown in above example.
Step 3: Add the following code in home.ts
Step 3: We need to create custom component code.
ionic g component Person
Add the following code in src/components/person/person.ts
Step 4: We need to add following code in person.html
Step 5: Import MyComponet in app.module.ts. Add MyComponent in @NgModule declarations, entry component.