Select

Angular Bootstrap Select is a form control, that after the click displays a collapsible list of multiple values which can be used in forms, menus or surveys.

Contrast Angular Bootstrap Select enables you to use ↑ and ↓ arrow keys to navigate through options and use ↵ key to select required option (works for stateful select).

Examples

Default Select example.

html

<CDBSelect [options]='option' selected="Choose an option"></CDBSelect>

typescript

import { Component, OnInit } from '@angular/core';
@Component({
  selector: 'app-select',
  templateUrl: './select.component.html',
  styleUrls: ['./select.component.scss'],
})
export class SelectComponent implements OnInit {
  option = [
    {
      text: 'Option 1',
      value: '1',
    },
    {
      text: 'Option 2',
      value: '2',
    },
    {
      text: 'Option 3',
      value: '3',
    },
  ];
  constructor() {}
  ngOnInit(): void {}
}

API

Here in this section you will find information about required modules and available inputs, outputs, methods and events of this component.

Contrast Select Bootstrap Modules used

import {SelectModule } from 'cdbangular';

API Reference: Contrast Select Inputs

The table below shows the possible input of the Select component.