angular-resource

Compare original and translation side by side

🇺🇸

Original

English

🇨🇳

Translation

Chinese

Angular Resource

Version: Angular 19+ (2025) Tags: Resource, Async, Signals

References: Resource API

版本： Angular 19+ (2025) 标签： Resource, Async, Signals

参考： Resource API

Best Practices

最佳实践

Use resource for async data

import { resource } from '@angular/core/rxjs-interop';

@Component({})
export class MyComponent {
  private http = inject(HttpClient);
  
  users = resource({
    loader: () => this.http.get<User[]>('/api/users').toPromise()
  });
}

Use with request

id = signal<string>('');

user = resource({
  request: () => ({ id: this.id() }),
  loader: ({ request }) => this.http.getUser(request.id).toPromise()
});

针对异步数据使用 resource

import { resource } from '@angular/core/rxjs-interop';

@Component({})
export class MyComponent {
  private http = inject(HttpClient);
  
  users = resource({
    loader: () => this.http.get<User[]>('/api/users').toPromise()
  });
}

结合请求参数使用

id = signal<string>('');

user = resource({
  request: () => ({ id: this.id() }),
  loader: ({ request }) => this.http.getUser(request.id).toPromise()
});