在Angular中，可以使用HttpClient模块来发送HTTP请求并获取数据。以下是一个示例代码，演示如何从缓存中获取数据：

首先，创建一个名为data.service.ts的服务文件，并在其中定义一个名为getData()的方法：

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Observable } from 'rxjs';
import { map } from 'rxjs/operators';

@Injectable({
  providedIn: 'root'
})
export class DataService {
  private cacheData: any;

  constructor(private http: HttpClient) { }

  getData(): Observable {
    if (this.cacheData) {
      // 如果缓存数据存在，则直接返回缓存数据
      return Observable.of(this.cacheData);
    } else {
      // 如果缓存数据不存在，则发送HTTP请求获取数据
      return this.http.get('your_api_url').pipe(
        map(response => {
          this.cacheData = response; // 将获取的数据存入缓存
          return response;
        })
      );
    }
  }
}

然后，在需要使用数据的组件中，可以通过依赖注入的方式使用DataService服务，并调用getData()方法获取数据。例如，创建一个名为home.component.ts的组件文件：

import { Component, OnInit } from '@angular/core';
import { DataService } from 'path/to/data.service';

@Component({
  selector: 'app-home',
  templateUrl: './home.component.html',
  styleUrls: ['./home.component.css']
})
export class HomeComponent implements OnInit {
  data: any;

  constructor(private dataService: DataService) { }

  ngOnInit() {
    this.getData();
  }

  getData() {
    this.dataService.getData().subscribe(response => {
      this.data = response;
    });
  }
}

最后，在home.component.html模板中，可以通过data属性来显示获取到的数据：

  
{{ data.title }}
  
{{ data.description }}

这样，当组件初始化时，会调用getData()方法从缓存或者服务器获取数据，并在模板中显示出来。如果缓存数据存在，会直接返回缓存数据，避免了重复发送请求。