budrobundy69 / budrobundy69/openapi-angular-spring-example

🧩 Integrate OpenAPI TypeScript Client into Angular 19 with Signals

未关闭
#21 0 条评论 0 个 reaction 已指派 1 人 已被 @budrobundy69 认领 在 GitHub 查看
🎨 frontend 🛠️ setup
主要语言
HTML
星标
0
派生
0
PR 合并指标
30 天内没有已合并 PR

描述

### 🧩 Integrate OpenAPI TypeScript Client into Angular 19 with Signals

**Goal:** Use the generated OpenAPI TS client to communicate with the backend, and manage state using Angular Signals and SignalStore.

---

### ✅ Tasks

#### 1. Setup SignalStore

- [ ] Create a signal store (`apiStore`) in `frontend/src/app/stores/`
- [ ] Store loading state, errors, and response data
- [ ] Export actions for component usage

#### 2. Create ApiService Wrapper

- [ ] Create `api.service.ts` in `frontend/src/app/services/`
- [ ] Inject OpenAPI-generated services (e.g., `DefaultService`)
- [ ] Wrap service methods to return observables or promises
- [ ] Handle and log HTTP errors gracefully

#### 3. Create Example Feature

- [ ] Create a component that:
- [ ] Triggers an API call using the store
- [ ] Displays loading/error/success state
- [ ] Uses Signals for UI updates

#### 4. Optional: Add Test Coverage

- [ ] Unit test the SignalStore and ApiService
- [ ] Mock OpenAPI responses

---

### 📁 Suggested Structure

frontend/
├── src/
│ ├── app/
│ │ ├── api/ # OpenAPI-generated
│ │ ├── services/
│ │ │ └── api.service.ts
│ │ ├── stores/
│ │ │ └── api.store.ts
│ │ └── features/
│ │ └── sample/
│ │ └── sample.component.ts

---

### 🔜 Next Steps (Separate Issues)

- Add tests to CI
- Extend SignalStore pattern across features
- Trigger OpenAPI client generation automatically in CI
- Cloud Foundry deploy with OpenAPI client

---

**Labels:** `🔄 openapi`, `🧱 frontend`, `🌐 angular`, `📦 integration`, `⚡ state`, `🧪 test`
**Milestone:** `M1 - Backend MVP`
**Project:** `OpenAPI Angular Spring Example`

贡献指南

这个仓库没有索引到贡献指南

评估

这个 Issue 还没有评估数据。

把新 issue 发到你的邮箱

精选适合新手参与的 GitHub issue 摘要。