如何在Angular 2中提供模拟服务以进行开发(而非测试)? [英] How can I provide mocked services for development (not testing) in Angular 2?

问题描述

我需要一种方法来在Angular 2的开发过程中(而不是在测试过程中)模拟我的服务.原因是REST风格的服务器不可靠(在没有通知的情况下更改API，不稳定且难以擦除和站立)再次).如果我可以仅模拟我的服务(基本上都是HTTP REST客户端)，那将是很好的.

I need a way to mock my services during development (not during testing) in Angular 2. The reason being is that the REST-ful server is not reliable (changing API without notification, not stable, and difficult to wipe and stand up again). It would be nice if I can just mock my services (which are all basically HTTP REST clients).

在Angular 2中创建模拟后端服务的最佳方法是什么?在模拟与测试有关的后端服务时，我得到了很多Internet结果，但是这种情况不是我的用例(我不是在模拟要测试，而是要进行开发).

What's the best approach for creating mock backend services in Angular 2? I get a lot of internet results for mocking backend services with respect to testing, but this context is not my use-case (I am not mocking to test but to develop).

我已经使用 angular cli 来创建和搭建我的项目，但我没有确定该工具是否能帮上忙.

I've used the angular cli to create and scaffold my project and I'm not sure if that tool can help out.

我正在寻找类似

I'm looking for an approach like Spring where we can annotate components/classes with "profiles" and then conveniently specify which profile is active to get the right dependencies injected.

推荐答案

我认为实现目标的最佳方法是使用接口和服务提供商.我希望以下示例代码可以为您指明正确的方向:

I think the best approach to achieve your goal is to use interfaces and a service provider. I hope the following example code can point you in the right direction:

data-tables.service-interface.ts

export interface DataTablesServiceInterface {
    getHeaders(): Promise<any[]>;
    getData(query?: string, offset?: number, size?: number): Promise<any>;
}

data-tables.service-provider.ts

import { Http } from '@angular/http';
import { OpaqueToken } from '@angular/core';

import { DataTablesServiceInterface } from './data-tables.service-interface';
import { DataTablesService } from './data-tables.service';
import { DataTablesMockService } from './data-tables.mock-service';

import { environment } from '../../../environments/environment';

let dataTablesServiceFactory = (http: Http) => {
    var serviceToReturn: DataTablesServiceInterface;
    if (environment.production) {
        serviceToReturn = new DataTablesService(http);
    } else {
        serviceToReturn = new DataTablesMockService();
    }
    return serviceToReturn;
};

export let dataTablesToken = new OpaqueToken('DataTablesServiceInterface');

export let dataTablesServiceProvider =
    {
        provide: dataTablesToken,
        useFactory: dataTablesServiceFactory,
        deps: [
            Http
        ]
    };

您只需要实现实际和模拟服务，并可以根据使用environment在angular-cli中已经实现的嵌入式配置文件机制提供它们.

You just need to implement the actual and mock service and can provide them depending on the embedded profile mechanism already implemented in angular-cli by use of environment.

修改: 还有一些我忘记提及的信息.在您负责的模块中，您需要声明dataTablesServiceProvider为提供者.在您要使用服务的组件中，DI的方法与标准方法略有不同.

There are a few more information I forgot to mention. In your responsible module you need to declare dataTablesServiceProvider as provider. In the components where you want to use the service, the approach of DI varies slightly from the standard approach.

在组件的构造函数中，您应编写以下内容:

In the constructor of the component you write the following:

constructor(@Inject(dataTablesToken) private dataTablesService: DataTablesServiceInterface)

如果您对不透明令牌感兴趣，我建议您看看按角度的不透明令牌

If you are interested in opaque tokens, I would suggest a look at Opaque Token by Angular

这篇关于如何在Angular 2中提供模拟服务以进行开发(而非测试)?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！