Angular SDK

Paket @tracio/angular membungkus inti @tracio/sdk dan menyediakan primitif Angular yang idiomatis: sebuah provider yang Anda sebarkan ke dalam konfigurasi aplikasi Anda, dan sebuah service berbasis signal yang dapat Anda inject di mana saja.

Instalasi

bash

npm install @tracio/angular @tracio/sdk

@angular/core (17, 18, atau 19) merupakan peer dependency dan diasumsikan sudah terpasang di aplikasi Anda.

Penyiapan

Sebarkan provideTracio(config) ke dalam ApplicationConfig.providers Anda.

TypeScript

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

Service

Inject TracioService untuk membaca status identifikasi melalui signal yang bersifat readonly:

Member	Tipe	Deskripsi
`visitorId()`	`Signal<string \| null>`	Pengenal pengunjung yang stabil.
`result()`	`Signal<TracioResult \| null>`	Hasil identifikasi lengkap.
`error()`	`Signal<TracioError \| null>`	Error terakhir, jika ada.
`isLoading()`	`Signal<boolean>`	Apakah sebuah fetch sedang berlangsung.
`getVisitorData()`	method	(Ambil ulang) data pengunjung secara imperatif.

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

Panggil getVisitorData() untuk menunda atau memicu ulang identifikasi — misalnya hanya setelah pengguna memberikan persetujuan.

Contoh lengkap

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

Langkah selanjutnya

Referensi JavaScript SDK — API inti @tracio/sdk yang menjadi dasar service ini
Penanganan Error — kode error dan strategi retry
Ikhtisar SDK — setiap paket framework dalam sekilas pandang

Service

Inject TracioService untuk membaca status identifikasi melalui signal yang bersifat readonly:

Member

Tipe

Deskripsi

visitorId()

Signal<string | null>

Pengenal pengunjung yang stabil.

result()

Signal<TracioResult | null>

Hasil identifikasi lengkap.

error()

Signal<TracioError | null>

Error terakhir, jika ada.

isLoading()

Signal<boolean>

Apakah sebuah fetch sedang berlangsung.

getVisitorData()

method

(Ambil ulang) data pengunjung secara imperatif.

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

Panggil getVisitorData() untuk menunda atau memicu ulang identifikasi — misalnya hanya setelah pengguna memberikan persetujuan.

Contoh lengkap

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