Angular中的服务(Services)

Angular中的服务是一个用于跨组件共享数据的单例对象。在Angular中，你可以创建自己的服务来封装可重用的逻辑，如API调用或数据缓存。

案例讲解：创建一个简单的数据服务

1. 首先，创建一个新的服务。在你的Angular项目中，使用Angular CLI创建一个新的服务。在终端中运行以下命令：

   ng generate service DataService

2. 然后，在生成的`data.service.ts`文件中，导入`Injectable`装饰器并添加到你的服务类中。你的服务类可能如下所示：

                       import { Injectable } from '@angular/core';
   
                       @Injectable({
                           providedIn: 'root',
                       })
                       export class DataService {
                           // 这里添加你的代码
                       }
                   

3. 现在，你可以在这个服务中添加任何你想要的逻辑。例如，你可以创建一个从API获取数据的函数。

                       import { HttpClient } from '@angular/common/http';
   
                       export class DataService {
                           constructor(private http: HttpClient) {}
   
                           getData() {
                               return this.http.get('https://api.example.com/data');
                           }
                       }
                   

4. 最后，在你的组件中，你可以使用`@Inject`装饰器来注入你的服务，并调用它的方法。

                       import { Component, Inject } from '@angular/core';
                       import { DataService } from './data.service';
   
                       @Component({
                           selector: 'app-example',
                           templateUrl: './example.component.html',
                           styleUrls: ['./example.component.css'],
                       })
                       export class ExampleComponent {
                           data: any;
   
                           constructor(private dataService: DataService) {}
   
                           getDataFromApi() {
                               this.dataService.getData().subscribe(data => (this.data = data));
                           }
                       }