CODEWITHSUNDEEP
angular
Minglei Lee
Minglei Lee

Reputation: 27

How to avoid exposing internal component in Angular

Suppose I have a OutlookBarComponent contains some bars like Microsoft Outlook. For each bar, there is a child component OutlookBarItemComponent. Both OutlookBarComponent and OutlookBarItemComponent are encapsulated in ControlModule, so that I can use them in another business module:

import { OutlookBarComponent, OutlookBarItemComponent } from 'control/control.module';

@NgModule({
  //...
  declarations: [
    OutlookBarComponent,
    OutlookBarItemComponent,
  ]
})
export class BusinessModule { }

This works fine.

Since OutlookBarItemComponent is an internal component in fact, I don't want BusinessModule know about it. But without importing and declaring OutlookBarItemComponent in BusinessModule, Angular complains

'app-outlook-bar-item' is not a known element

My questions are:

  1. Is there a way to use OutlookBarItemComponent as internal component without exposing it to BusinessModule?

  2. In this case, is it a good practice to separate the logic into OutlookBarComponent and OutlookBarItemComponent?

Upvotes: 0

Views: 129

Answers (1)

Suresh Kumar Ariya
Suresh Kumar Ariya

Reputation: 9764

For Item1, Angular follows ES6 modules concept, where you need to export the files in order to import in else where. Similarly, you need to declare those component under declaration property of Modules. So Angular compiler easily identifies when it came accross custom elements in template files. You also need to export if you want to use that component in another modules.

For Item2, as per general guidelines, your component needs be slim that should contain View/presentation Logic. You can move business logic to services, which can be re-used in other components. There is also smart and dumb component architecture. Smart Component will perform all the business logic related to features. dumb component will receive the data as input and used only for presentation Logic.

Upvotes: 1

Related Questions