我应该在其构造函数中还是在 app.component 的 ngOnInit 方法中初始化 Angular 服务?

Should I initialise an Angular service in its constructor or in the ngOnInit method of the app.component?

我是 Angular 的新手。我有一项服务需要订阅另一项服务提供的主题。如果这是一个组件,我会在组件的 ngOnInit 方法中创建订阅。不过,服务不会调用 NgOnInit。我已经创建了一个初始化方法来创建订阅,但我不确定从哪里调用它最好。我已经看到它以两种方式完成:

1) 在服务构造函数中调用初始化方法

2) 将服务注入 app.component 并在 app.component 的 ngOnInit 方法中调用服务初始化方法,例如

方法一:

export class MyService{

    constructor(private myRequiredService: RequiredService) {
        this.initialiseSubs();
    }

    initaliseSubs(){
        //code to set up subscriptions
    }
}

方法二


export class MyService{

    constructor(private myRequiredService: RequiredService) {}

    initaliseSubs(){
        //code to set up subscriptions
    }
}

export class AppComponent implements OnInit{
  title = 'my-app';

  constructor(private myService:MyService){}

  ngOnInit(){
    this.myService.initialiseSubs();

  }
}

这两种方法似乎都有效,但我欢迎就哪种方法更可取提出建议。提前致谢。

服务是您定义可观察对象的地方,例如getAllEmployees()。组件是您使用这些服务的地方;例如通过将它们注入构造函数)。

    export class MyService{
    
        constructor(private myRequiredService: RequiredService) {}
    
        getAllEmployees():Observable<Employee[]>{
           
           // return Observables of type Employee[]
        }
    }

假设现在您有一个名为 EmployeesList 的组件,它负责显示所有员工数据。首先,您需要将服务注入到构造函数中。接下来,您调用 getAllEmployees 服务方法并订阅以生成结果“aka 数据”。

    import { Component, OnInit } from '@angular/core';
    
    export class EmployeesList implements OnInit{
      private employees: Employee[];
    
      constructor(private myService:MyService){}
    
      ngOnInit(): void{
         // it's better to do the subscription inside ngOnInit.
        this.myService.getAllEmployees().subscribe(
          employees => {
             this.employees = employees; 
          }
        );  
      }

    }

这基本上就是您应该做的。但是,为了更好的开发和用户体验,我建议使用 angular resolvers。解析器基本上是可以附加到特定路由的方法,angular 将在渲染组件之前调用它们。 但这被认为是一个高级主题,除非你问我,否则我不会 post 任何代码。

如果回答对您有帮助,请标为正确。 祝一切顺利!

编辑 在下面的评论中讨论后,我了解到您有不同的后端可以根据当前路由进行通信,我会这样处理这种情况:

    // inside the component 
    constructor(private router: Router) {}
    ngOnInit(){
            // You need to find 
            this.myService.getAllEmployees(this.router.url).subscribe(
              employees => {
                 this.employees = employees; 
              }
    
            );
      
    }

// inside the service file:

    export class MyService{
        
            constructor(private myRequiredService: RequiredService) {}
        
            getAllEmployees(URL: string):Observable<Employee[]>{
               // decide which back-end to connect with depending on the URL
               switch(url){
                case "example1":
                                URL = "url1";
                         break;
                case "example2":
                                URL = "url2";
                         break;
               }
               // Connect to the resource using URL param
               // return Observables of type Employee[]
            }
    }