Marcos Silva
42 lines
1.6 KiB
Markdown
42 lines
1.6 KiB
Markdown
---
|
|
name: angular-access-modifiers-francisco-rangel
|
|
description: Enforces explicit TypeScript access modifiers (public/protected/private) on every class member of an Angular component, directive, or pipe based on usage.
|
|
---
|
|
|
|
# Angular Access Modifiers
|
|
|
|
Every field, getter/setter, and method on an Angular class must have an **explicit** TypeScript access modifier. Never leave members implicit.
|
|
|
|
## Visibility Rules
|
|
|
|
| Used in HTML template? | Used only inside TS class? | External access (Parent, Test, Service)? | Access Modifier |
|
|
| :--- | :--- | :--- | :--- |
|
|
| **Yes** | — | — | `protected` |
|
|
| **No** | **Yes** | **No** | `private` |
|
|
| **No** | — | **Yes** | `public` |
|
|
|
|
---
|
|
|
|
## Instructions
|
|
|
|
1. **`protected`**: Use for all properties, signals, getters/setters, and methods accessed directly inside the template (`.html` or inline `template`).
|
|
2. **`private`**: Use for internal logic, helper methods, state variables, or subscriptions that are never accessed outside this single file.
|
|
3. **`public`**: Use ONLY for `@Input()`, `@Output()`, component inputs/outputs created via functions (`input()`, `output()`), public API methods called by parents/tests, or Angular lifecycle hooks (`ngOnInit`, `ngOnDestroy`, etc.).
|
|
4. **Never leave any member without an explicit modifier.**
|
|
|
|
## Examples
|
|
|
|
### ❌ Incorrect (Implicit or misscoped)
|
|
```typescript
|
|
@Component({ ... })
|
|
export class UserProfileComponent {
|
|
userName = signal('John'); // Implicit public (avoid)
|
|
|
|
ngOnInit() { // Implicit public
|
|
this.fetchData();
|
|
}
|
|
|
|
fetchData() { // Implicit public
|
|
// ...
|
|
}
|
|
} |