Phone Number Input

A custom form control that combines a country code selector with a text input, automatically emitting international format phone numbers.

freenew

Basic Usage

Use <base-phone-input> natively with Angular Forms. It implements ControlValueAccessor.

Contact Number

Bound Value: +441234567890

HTML

Installation

Run the following command to add this component to your project:

bash

npx base-ui-cli add phone-input

API Reference

For AI agents

Copy a prompt with the registry name, CLI install, and import — or add the Base UI MCP server.

bash

npx -y base-ui-mcp

Base UI provides standalone components. Import the exact elements you want to use into your component.

typescript (Example)

// Install: npx base-ui-cli add phone-input
// Paths are relative to aliases.components (default: src/app/components)
import { PhoneInputComponent } from './phone-input/phone-input.component';

@Component({
  selector: 'app-your-component',
  imports: [
    PhoneInputComponent
  ],
  template: `...`
})
export class YourComponent {}

API for phone-input — generated from JSDoc in the library source.

API reference for phone-input
API	Member	Type	Description
`base-phone-input`	`—`	`—`	A phone number input component with a country selector.