Skip to main content

Service Injection

VertiGIS Studio Web uses dependency injection as a way to obtain a reference to VertiGIS Studio Web services in your application. Services can be referenced from within a component model.


If a custom command or operation can accomplish the behavior you need without a direct service reference, this is preferred to decrease the degree of coupling.

The @inject decorator can be used to reference a service from within your component model. The following example demonstrates injecting the RegionService into a custom component model.

import { ComponentModelBase } from "@vertigis/web/models";
import { RegionService } from "@vertigis/web/region";
import { FrameworkServiceType, inject } from "@vertigis/web/services";

export default class ExampleComponentModel extends ComponentModelBase {
// NOTE: This property isn't populated until the model is `initialized`.
// It is not available in the constructor of this model.
regionService: RegionService | undefined;

private _distance = "100";

get distance(): string {
return this.regionService &&
this.regionService.measurementSystem === "metric"
? `${this._distance} m`
: `${this._distance} ft`;

The property that the @inject decorator is bound to will be populated during the initialization process of the component model that the decorator was used in. The property value will be undefined until the component model is initialized.