在Angular中，可以使用RxJS的Observables和缓存技术来解决组件在效果返回缓存结果时不会挂载的问题。可以使用rxjs-cached-observable库来实现缓存效果。

首先，安装rxjs-cached-observable库:

npm install rxjs-cached-observable

然后，创建一个service来处理缓存逻辑。在这个service中，我们可以使用rxjs-cached-observable库中的cached$操作符来实现缓存效果。下面是一个示例代码：

import { Injectable } from '@angular/core';
import { Observable } from 'rxjs';
import { cached$ } from 'rxjs-cached-observable';

@Injectable({
  providedIn: 'root'
})
export class MyDataService {
  private cachedData$: Observable;

  getData(): Observable {
    if (!this.cachedData$) {
      this.cachedData$ = this.fetchData().pipe(
        cached$() // 使用cached$操作符来缓存结果
      );
    }
    return this.cachedData$;
  }

  fetchData(): Observable {
    // 这里是获取数据的逻辑
    // 可以是一个HTTP请求或其他异步操作
    // 返回一个Observable来表示异步结果
  }
}

现在，在组件中使用这个service来获取数据，并订阅它。这样，当组件多次订阅数据时，第二次及以后的订阅将立即获取到缓存的数据，而不需要再次发起请求。下面是一个组件的示例代码：

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

@Component({
  selector: 'app-my-component',
  template: `
    

      
    
  `
})
export class MyComponent implements OnInit {
  data$: Observable;

  constructor(private myDataService: MyDataService) {}

  ngOnInit() {
    this.data$ = this.myDataService.getData();
  }
}

在上面的示例中，当组件初始化时，会调用myDataService.getData()来获取数据，然后将数据赋值给data$变量。在模板中，使用async管道来订阅data$，并在数据到达时显示数据。

这样，当组件多次订阅数据时，只有第一次会触发实际的数据获取逻辑，后续的订阅会立即获取到缓存的数据，而不会再次发起请求。这样就解决了组件在效果返回缓存结果时不会挂载的问题。