通过从后端获取数据来设置从app.module导入

// 1. 创建一个服务
import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';

@Injectable()
export class BackendService {
  constructor(private http: HttpClient) {}

  // 2. 发起HTTP请求获取后端数据
  getData() {
    return this.http.get('https://backend-api.com/data');
  }
}

// 4. 在app.module中注册服务
import { NgModule } from '@angular/core';
import { HttpClientModule } from '@angular/common/http';

@NgModule({
  imports: [HttpClientModule],
  providers: [BackendService],
})
export class AppModule {}

// 5. 在app.module中使用服务获取后端数据
import { Component } from '@angular/core';
import { BackendService } from './backend.service';

@Component({
  selector: 'app-root',
  template: '<h1>{{ data }}</h1>',
})
export class AppComponent {
  data: any;

  constructor(private backendService: BackendService) {}

  ngOnInit() {
    this.backendService.getData().subscribe((response: any) => {
      // 保存后端数据到变量中
      this.data = response.data;
    });
  }
}