angular - Angular - 模块分离 - 共享或公共代码的最佳实践

Question

我有一些 Angular 服务，它们具有相同的方法来解析 json 响应、处理错误等（例如，如果它是 422 错误则进行捕获）。

显然，我不希望将这些方法复制并粘贴到每个服务中，但我似乎找不到任何关于我应该将这段代码放在哪里的指导。

它们不是类方法，只是每个服务中当前相同的私有方法。

这是一个例子：

   private parseToString(jsonResponse: any){
    return Object.keys(jsonResponse).reduce(
      (prev, next) => prev.concat(jsonResponse[next].map(
        v => next + ' ' + v).join(', ')), []).join(', ');
  }

有什么方法可以创建一个帮助模块或类似 Rails Concern 的东西，你可以包括？

例如说我有这个文件夹：

应用程序/服务

其中有我的各种 .ts 服务文件。

我可以创建“app/services/helpers”文件夹并在其中放置一个文件……但是该 .ts 文件中包含什么？

例如。parser-helper.ts 可能是文件名，但里面的代码是什么样的？它应该是一个模块吗？如果是这样，我怎样才能将它包含到服务中？

例如，这是推荐的方法吗？

app/services/helpers/parser-helper.module.ts

module parserHelperModule {

  export function helperA(){}
  export function helperB(){}

}

score 5 · Accepted Answer

在 parser-helper.ts 中：

export function parseToString(jsonResponse: any): string {
    ...
}

在任何其他 TypeScript 文件中：

import { parseToString } from './relative/path/to/parser-helper';

...
const s = parseToString(response);

score 2 · Accepted Answer

您可以将公共代码作为公共服务本身，如下所示

export class CommonService {
    public parseToString(jsonResponse: any){
            return Object.keys(jsonResponse).reduce(
                        (prev, next) => prev.concat(jsonResponse[next].map(
                            v => next + ' ' + v).join(', ')), []).join(', ');
  }  
   public someOtherMethod(){

   }
}

因此，您可以在应用程序的任何位置导入该类并使用它们

注意：当您在单个服务中定义常用方法时，请确保它们是公共的

更新 1：

是的，使用提供所有公共代码的单独模块并使主 AppModule 导入看起来像的CommonModule是一个好习惯。

@NgModule({
  imports:    [ 
                HttpModule, Logger, Toaster, ... 
              ],
  declarations: [ CommonCmoponents
                ],
  providers:[Service1, Service2 ]
})
export class CommonModule { }

确保你的公共模块只是作为一个集合，这个 CommonModule 不应该包含

浏览器模块
自举组件

您可能会寻找下图来分离关注点

angular - Angular - 模块分离 - 共享或公共代码的最佳实践

2 回答 2

Related

Reference