Angular 角度测试：如何模拟服务响应？

我最近用Angular创建了一个web应用程序。我想测试使用服务的组件。该服务有一个返回相当复杂的可观察对象的方法。 这是my component中使用服务获取响应的方法（依次由

ngOnInit

调用）的基本部分：

myMethod(param1, param2) {

    this.myRealService.getValues(param1, param2).subscribe(
      response => {
        console.log("My response: ", response.body)
      }
    ); 
}

现在，我将向您展示我在组件的

.spec.ts文件中所做的工作。我从“rxjs”导入了
import{Observable，of}：

const mockService = {

   myService: {
     someNumber1: 1,
     someNumber2: 2
   },


    getValues: function (param1, param2) {
     
      return of(this.myService);
      
    }

}

显然，所有内容都在
descripe
块中（我不报告整个代码，因为它充满了与问题无关的依赖项等）。重要的是，在我的文件中，我做到了：

beforeEach(async(() => {

    TestBed.configureTestingModule({
      declarations: [ MyComponent],
      imports: [],
      providers: [{provide: MyRealService, useValue: mockService}],
      schemas: [CUSTOM_ELEMENTS_SCHEMA, NO_ERRORS_SCHEMA]
    })
    .compileComponents();
  }));

通过明确声明我正在用mock替换服务的使用。我希望组件方法
myMethod
测试时，响应对象与测试中的模拟对象相同。不幸的是，这并没有发生。Karma console会打印以下内容：


我的回答：
未定义
。我肯定错了，但这个问题对我来说似乎很容易。如何正确地模拟数据并将其无误地传递，以便在控制台中看到模拟的数据？
查看我使用cats制作的这个工作堆栈Blitz示例

1。在试图控制台log response.body的组件中。服务模拟中没有遵循该结构。2.如果您的订阅在ngOnInit中启动，您可能需要在组件创建后调用detectChanges。在组件创建后调用detectChanges！但正是组件创建过程本身偶然发现了这个调用。你的答案不是很有用。你的代码似乎没有任何问题。您是否可以共享组件的构造函数，以及完整的测试文件？