---
# System prepended metadata

title: "\U0001F525 Angular 22's New `@Service` Decorator   What Changed & Why It Matters"
tags: [Angular]

---

# 🔥 Angular 22's New `@Service` Decorator   What Changed & Why It Matters

> I've been using `@Injectable` for years. We all have. It's just... Angular. You don't question it.  
> But Angular 22 ships `@Service`   and after playing with it, I realized it's a genuinely different way of thinking.

---

## ⚙️ How Angular Creates the Instance

| | `@Injectable` | `@Service` |
|---|---|---|
| **Instantiation** | Angular calls `new YourClass()` | Uses the return value of your factory directly |
| **Class body** | Holds your real logic | Becomes pure TypeScript types |
| **Control** | Angular-managed | You control what gets exposed |

---

## 🔒 Privacy   Without the Boilerplate

With `@Injectable`, you need extra keywords and annotations to hide your internals.

With `@Service`, any variable inside the factory **lives in the closure**   private by default, because of how JavaScript already works. No extra effort required.

---

## 🎯 The Ability to Destructuring

```ts
// ❌ @Injectable   
const { getData } = myService; // trap!

// ✅ @Service factory   destructuring just works
const { getData } = myService; // no binding needed
```

In `@Service` factories, there's no class instance   which means **destructuring just works**. No `.bind()`, no arrow function workarounds.

---

## 📦 What the Class Body Actually Does Now

- **`@Injectable`** → holds your real runtime logic
- **`@Service`** → class body is purely for TypeScript types; actual logic moves into the factory

Takes a minute to adjust, but it ends up feeling clean.

---

## 🔄 You Control What Gets Exposed

```ts
@Service({
    autoProvided: true,
     factory: () => {
    const secret = 'hidden';
    const publicMethod = () => `result`;

    return { publicMethod }; // expose only what you want
  }
})
class MyService {...}
```

`@Injectable` always returns the full class instance.  
`@Service` lets you return an object, a subset of methods, or something entirely different.

---

## ✍️ Trade-offs to Know

- ➕ Better encapsulation out of the box
- ➕ No `this` binding issues
- ➕ Leaner public API surface
- ➖ A bit more upfront boilerplate (maintaining types + factory logic separately)

---

## 💡 Bottom Line

Angular keeps pushing toward code that's easier to reason about. `@Service` isn't a replacement for `@Injectable` overnight   but if you care about **encapsulation** and **predictable behavior**, it's worth a proper look.

## Hint:
I might be mistaken in some places. I’m still working on figuring out how to use this factory and destructuring in a real-world example and scenario. 

### IT Would be awesome if you see something wrong and leave a comment on it so we all learn
---