Angular SDK

החבילה @tracio/angular עוטפת את הליבה @tracio/sdk וחושפת פרימיטיבים אידיומטיים של Angular: provider שאותו פורשים לתוך תצורת האפליקציה, ו-service מבוסס-signal שאפשר להזריק בכל מקום.

התקנה

bash

npm install @tracio/angular @tracio/sdk

@angular/core (17, 18 או 19) הוא peer dependency, ומצופה שכבר יהיה מותקן באפליקציה שלך.

הגדרה

פרשו את provideTracio(config) לתוך ApplicationConfig.providers.

TypeScript

// app.config.ts
import { provideTracio } from "@tracio/angular"
export const appConfig: ApplicationConfig = {
  providers: [provideTracio({ publicKey: "5ca175fc…" })],
}

Service

הזריקו את TracioService כדי לקרוא את מצב הזיהוי דרך signals לקריאה בלבד:

Member	Type	תיאור
`visitorId()`	`Signal<string \| null>`	מזהה המבקר היציב.
`result()`	`Signal<TracioResult \| null>`	תוצאת הזיהוי המלאה.
`error()`	`Signal<TracioError \| null>`	השגיאה האחרונה, אם ישנה.
`isLoading()`	`Signal<boolean>`	האם כרגע מתבצעת שליפה.
`getVisitorData()`	method	שליפה (חוזרת) של נתוני המבקר באופן אימפרטיבי.

TypeScript

// home.component.ts
import { Component, inject } from "@angular/core"
import { TracioService } from "@tracio/angular"
@Component({ selector: "app-home", template: `<span>{{ tracio.visitorId() }}</span>` })
export class HomeComponent {
  readonly tracio = inject(TracioService)
}

קראו ל-getVisitorData() כדי לדחות או להפעיל מחדש את הזיהוי — לדוגמה רק לאחר שהמשתמש נתן את הסכמתו.

דוגמה מלאה

TypeScript

// app.config.ts
import { provideTracio } from "@tracio/angular"
export const appConfig: ApplicationConfig = {
  providers: [provideTracio({ publicKey: "5ca175fc…" })],
}

TypeScript

// home.component.ts
import { Component, inject } from "@angular/core"
import { TracioService } from "@tracio/angular"
@Component({ selector: "app-home", template: `<span>{{ tracio.visitorId() }}</span>` })
export class HomeComponent {
  readonly tracio = inject(TracioService)
}

הצעדים הבאים

סימוכין ל-JavaScript SDK — ה-API של הליבה @tracio/sdk שעליו נבנה ה-service
טיפול בשגיאות — קודי שגיאה ואסטרטגיות retry
סקירת SDKs — כל חבילת framework במבט אחד

Service

הזריקו את TracioService כדי לקרוא את מצב הזיהוי דרך signals לקריאה בלבד:

Member

Type

תיאור

visitorId()

Signal<string | null>

מזהה המבקר היציב.

result()

Signal<TracioResult | null>

תוצאת הזיהוי המלאה.

error()

Signal<TracioError | null>

השגיאה האחרונה, אם ישנה.

isLoading()

Signal<boolean>

האם כרגע מתבצעת שליפה.

getVisitorData()

method

שליפה (חוזרת) של נתוני המבקר באופן אימפרטיבי.

TypeScript

// home.component.ts
import { Component, inject } from "@angular/core"
import { TracioService } from "@tracio/angular"
@Component({ selector: "app-home", template: `<span>{{ tracio.visitorId() }}</span>` })
export class HomeComponent {
  readonly tracio = inject(TracioService)
}

קראו ל-getVisitorData() כדי לדחות או להפעיל מחדש את הזיהוי — לדוגמה רק לאחר שהמשתמש נתן את הסכמתו.

דוגמה מלאה

TypeScript

// app.config.ts
import { provideTracio } from "@tracio/angular"
export const appConfig: ApplicationConfig = {
  providers: [provideTracio({ publicKey: "5ca175fc…" })],
}

TypeScript

// home.component.ts
import { Component, inject } from "@angular/core"
import { TracioService } from "@tracio/angular"
@Component({ selector: "app-home", template: `<span>{{ tracio.visitorId() }}</span>` })
export class HomeComponent {
  readonly tracio = inject(TracioService)
}