Full Stack Development with JHipster

Angular components of the entity

For an entity, there are six component classes generated in four files and four HTML files that are used in the components. 

ProductComponent, defined in product.component.ts handles the main listing screen. It uses product.component.html, as the template. The component manages the view and their actions. It also calls multiple services to fetch data and to do other actions such as alerts and event broadcasts:

@Component({    selector: 'jhi-product',    templateUrl: './product.component.html'})export class ProductComponent implements OnInit, OnDestroy {    ...}

product-dialog.component.ts defines ProductDialogComponent and ProductPopupComponent, which handle the create/edit dialog page using template product-dialog.component.html ...