Skip to main content

Angular Client SDK

Background#

Angular Client SDK повторно использует ряд концепций javaScript.

Angular Client включает в себя:

  • параметры инициализации имеют тот же набор параметров, но специфичными для angular.
  • services
  • паттерн инъекция зависимостей

Инициализация SDK#

Вы можете установить модуль Sigma через npm или yarn.

npm install expf-sigma.js

Пример#

Для работы sdk можно настроить отдельный services, который будет содержать настройки sdk и данные экспериментов, фича флагов.

./src/app/services/sigma.services.js
import { Injectable } from '@angular/core;import Sigma from 'expf-sigma.js';
@Injectable({  providedIn: 'root'})
export class SigmaService {  sigmaData: {    title: string;    buttonText: string;    buttonColor: string;  } = {    title: '',    buttonText: '',    buttonColor: 'transparent'  };
  async getSigma() {    const sigma = new Sigma();    const token = 'token';    sigma.init({      token,      userData: {        email: '1ex@mail.ru',        custom: {          cookieKey: '1',        },      },    });
    const browserName = await sigma.checkFlag('browser_name');    const buttonColor = await sigma.checkFlag('button_color');    const pay = await sigma      .getExperiment('exp_name_pay')      .then((res: { getFeatureValue: (arg0: string) => any }) =>        res.getFeatureValue('pay')      );
    this.sigmaData.buttonColor = buttonColor || 'red';    this.sigmaData.buttonText = pay || 'cache';    this.sigmaData.title = browserName;  }}

Результат можно передать в любой конструктор компонента в виде инъекции

./src/app/button/button.component.js
import {  Component,  OnInit,} from '@angular/core';
import { SigmaService } from '../services/sigma.services';
@Component({  selector: 'app-button',  styleUrls: ['./button.component.css'],  templateUrl: `    <button      class="button"      *ngIf="service.sigmaData?.buttonText"      [ngStyle]="{ 'background': service.sigmaData?.buttonColor }"    >      {{ service.sigmaData?.buttonText }}    </button>  `,})
export class ButtonComponent implements OnInit {  constructor(@Optional() public service: SigmaService) {}
  ngOnInit(): void {}}