# Quickstart — Angular

Integrate `@ios-web-bluetooth/core` with Angular 17+ standalone components.

## Prerequisites

- The WebBLE Safari Web Extension enabled on your origin. See the [base quickstart](quickstart.md).
- Angular 17+ (standalone components, signals).

## 1. Install

```bash
npm install @ios-web-bluetooth/core
```

## 2. Mount the polyfill at bootstrap

```ts
// main.ts
import '@ios-web-bluetooth/core/auto';
import { bootstrapApplication } from '@angular/platform-browser';
import { AppComponent } from './app/app.component';

bootstrapApplication(AppComponent).catch((err) => console.error(err));
```

Importing at `main.ts` guarantees `navigator.bluetooth` exists before any component renders.

## 3. Read a heart-rate monitor

```ts
// heart-rate.component.ts
import { Component, signal } from '@angular/core';

@Component({
  selector: 'app-heart-rate',
  standalone: true,
  template: `
    <button (click)="connect()">Connect</button>
    <p *ngIf="err()">Error: {{ err() }}</p>
    <p *ngIf="!err()">{{ bpm() ?? '—' }} bpm</p>
  `
})
export class HeartRateComponent {
  bpm = signal<number | null>(null);
  err = signal<string | null>(null);

  async connect() {
    try {
      const device = await navigator.bluetooth.requestDevice({
        filters: [{ services: ['heart_rate'] }]
      });
      const server = await device.gatt!.connect();
      const service = await server.getPrimaryService('heart_rate');
      const char = await service.getCharacteristic('heart_rate_measurement');
      await char.startNotifications();
      char.addEventListener('characteristicvaluechanged', (ev) => {
        const v = (ev.target as BluetoothRemoteGATTCharacteristic).value!;
        this.bpm.set(v.getUint8(0) & 0x01 ? v.getUint16(1, true) : v.getUint8(1));
      });
    } catch (e) {
      this.err.set((e as Error).message);
    }
  }
}
```

## 4. Type support

The W3C Web Bluetooth types ship with most modern TypeScript configurations. If `navigator.bluetooth` is flagged as `any`, install the DOM types add-on:

```bash
npm install --save-dev @types/web-bluetooth
```

## Next

- [API reference](api-reference.md)
- [Recipes](recipes.md)
- [Premium APIs](premium.md)
