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 {}}