Angular 2/4 Injectable 中的函数的单独文件

Question

我正在编写一个可能会呈指数增长的服务，我希望能够编写单独的文件并将它们加载到组件使用的 @Injectable 中。通常我会编写多个服务并将每个服务注入到组件中，但我的组件已经相当庞大，我觉得如果我可以只加载一个服务并处理其中的所有功能会更容易维护一项服务。我希望我没有用谷歌搜索正确的东西，这就像导入一样简单。

总体思路是这样的：

-configfns1.ts

-configfns2.ts（包含多个我希望可用的 ts 函数 config.service）

-config.service.ts

import { Injectable } from '@angular/core'
//{{Possibly import functions here}}

@Injectable ()
export class ConfigService {

  //{{Or possibly load within the class}}

}

-配置-view.component.ts

import { Component, OnInit } from '@angular/core';
import { ConfigService } from '../services/config.service';

@Component({
  selector: 'app-config-view',
  templateUrl: './config-view.component.html',
  styleUrls: ['./config-view.component.scss']
})

export class ConfigViewComponent implements OnInit {

  constructor(private configService: ConfigService){  }

  ngOnInit() {
          this.configService.configfn1(); //<---This would be a function loaded from configfns1.ts, and injected from config.service.ts
      })

  onClick() {
    this.configService.configfn2(); //Another fn loaded from configfns2.ts
  }

}

这个方法可行吗？还是我只需要继续为每个服务创建单独的服务，然后将每个服务导入到我的组件中？

Answer 1

经过更多谷歌搜索后，我发现这是一个简单的打字稿导入答案。

-config.service.ts

import { Injectable } from '@angular/core'
import * as configFns1 from './configfns1.ts'
import * as configFns2 from './configfns2.ts'

@Injectable ()
export class ConfigService {

  fn1() {
    configFns1.fn1();
  }

  fn2() {
    configFns2.fn2();
  }
}

fn1() 和 fn2() 可以正常调用

Angular 2/4 Injectable 中的函数的单独文件

Separate Files for Functions in Angular 2/4 Injectable

typescript

angular2-services

angular2-injection

angular