Angular13中NgRx/data能否为DefaultDataService定义并引用自定义基础API路径？

NgRx/data 完全支持避免重复硬编码基础URL的需求，你可以通过以下几种方式实现：

1. 自定义服务内定义基础URL常量 #

在MyObjectService中定义私有基础URL变量，所有重写方法基于该变量拼接完整路径，这是最直接的实现方式：

import { HttpClient } from '@angular/common/http';
import { DefaultDataService, Logger, HttpUrlGenerator } from '@ngrx/data';
import { Observable } from 'rxjs';
import { map } from 'rxjs/operators';
import { MyObject } from './path-to-myobject';

export class MyObjectService extends DefaultDataService<MyObject> {
  // 定义基础URL常量
  private readonly baseApiUrl = 'http://localhost:8085/myapi';

  constructor(
    http: HttpClient,
    httpUrlGenerator: HttpUrlGenerator,
    logger: Logger
  ) {
    super('MyObject', http, httpUrlGenerator, logger);
  }

  getAll(): Observable<MyObject[]> {
    return this.http.get(`${this.baseApiUrl}/myobjects`).pipe(
      map((response: any) => {
        // 你的数据处理逻辑
        return response.data;
      })
    );
  }

  // 示例：重写getById方法，复用基础URL
  getById(id: string | number): Observable<MyObject> {
    return this.http.get(`${this.baseApiUrl}/myobjects/${id}`).pipe(
      map(response => response.data)
    );
  }
}

2. 配置全局/实体级DefaultDataServiceConfig #

通过NgRx/data提供的DefaultDataServiceConfig，可以全局配置基础URL，也可为特定实体单独配置资源路径，后续通过HttpUrlGenerator自动获取对应URL，无需手动拼接：

第一步：在模块中配置服务 #

在根模块（如AppModule）或特性模块中注入配置：

import { NgModule } from '@angular/core';
import { DefaultDataServiceConfig } from '@ngrx/data';

const defaultDataServiceConfig: DefaultDataServiceConfig = {
  // 全局基础URL
  root: 'http://localhost:8085/myapi',
  // 为特定实体单独配置资源路径（可选，优先级高于全局root）
  entityHttpResourceUrls: {
    MyObject: {
      entityResourceUrl: 'http://localhost:8085/myapi/myobjects/',
      collectionResourceUrl: 'http://localhost:8085/myapi/myobjects/'
    }
  }
};

@NgModule({
  providers: [
    { provide: DefaultDataServiceConfig, useValue: defaultDataServiceConfig }
  ]
})
export class AppModule {}

第二步：在自定义服务中使用HttpUrlGenerator获取URL #

export class MyObjectService extends DefaultDataService<MyObject> {
  constructor(
    http: HttpClient,
    private readonly httpUrlGenerator: HttpUrlGenerator,
    logger: Logger
  ) {
    super('MyObject', http, httpUrlGenerator, logger);
  }

  getAll(): Observable<MyObject[]> {
    // 获取实体集合的URL
    const collectionUrl = this.httpUrlGenerator.collectionResourceUrl('MyObject');
    return this.http.get(collectionUrl).pipe(
      map((response: any) => {
        // 你的数据处理逻辑
        return response.data;
      })
    );
  }

  // 示例：获取单个实体的URL
  getById(id: string | number): Observable<MyObject> {
    const entityUrl = this.httpUrlGenerator.entityResourceUrl('MyObject', id);
    return this.http.get(entityUrl).pipe(
      map(response => response.data)
    );
  }
}

3. 结合Angular环境变量管理 #

将基础URL放到Angular环境配置文件中，方便不同环境（开发/生产）切换，同时避免硬编码：

环境文件示例（environment.ts） #

export const environment = {
  production: false,
  apiBaseUrl: 'http://localhost:8085/myapi'
};

在服务中使用环境变量 #

import { environment } from '../../environments/environment';

export class MyObjectService extends DefaultDataService<MyObject> {
  private readonly baseApiUrl = environment.apiBaseUrl;

  // ... 其余代码同方法1
}

内容的提问来源于stack exchange，提问作者Dave