SuperAPI AI 工具集

angular-http

前端与建站

查看项目

更新于 10-16 03:38

技能介绍

该技能用于在 Angular v20+ 中实现 HTTP 数据获取,核心是用官方的 signal 方案 httpResource()、通用异步方案 resource(),以及传统的 HttpClient。

常用能力 httpResource():基于信号的 HTTP 封装,会随依赖信号变化自动重新请求,提供 value()、hasValue()、error()、isLoading()、status() 等状态信号,以及 reload()、set()、update() 操作;支持简单 URL、完整请求选项(method、headers、params)、defaultValue,以及在参数为 undefined 时跳过请求。resource():面向非 HTTP 的异步操作或自定义 fetch,通过 params 与 loader 配置,支持 abortSignal、defaultValue 和条件加载。HttpClient:传统方式,支持 GET、POST、PUT、PATCH、DELETE 及 headers、params、observe、responseType 等选项,可配合 toSignal 转信号。拦截器:以函数式 HttpInterceptorFn 编写认证、错误、日志拦截器,并通过 provideHttpClient(withInterceptors([...])) 注册。错误处理:httpResource 可读取 error 并提供重试,HttpClient 可结合 RxJS 的 retry、catchError。加载状态:用 status() 区分 idle、loading、reloading、resolved、error,示例中用 @switch 分支渲染。

使用方式 导入 httpResource 或 resource 与 signal,在组件中以工厂函数声明资源并在模板读取状态;HttpClient 通过 inject 获取实例发起请求;拦截器在应用配置中统一注册。

适用与限制 适合需要响应式自动重取、信号状态管理或统一请求拦截的 Angular 项目。httpResource 与 resource 需 Angular v20+ 且为信号式写法;非 HTTP 异步用 resource 或自定义 fetch;复杂 Observable 操作则沿用 HttpClient。文中未提供安装命令、具体版本约束与收费信息。