Ngx UI Switch screenshot

Ngx UI Switch

Author Avatar Theme by Webcat12345
Updated: 11 Feb 2025
111 Stars

Angular UI Switch component

Categories

Overview

The Angular UI Switch Component is a simple iOS 7 style switch component for Angular. It is inspired by switchery in Angular. This component allows for easy integration of stylish toggle switches in Angular applications.

Features

  • CSS styling: Customize the look of the switch component.
  • Switch content (checkedLabel, uncheckedLabel): Provide labels for the checked and unchecked states of the switch.
  • Global options: Set global configurations to override default values.
  • Two-way binding: Control the switch state with params like checked, disabled, and loading.
  • Change events: Define actions for events like change, value change, and before change.
  • Size and color customization: Adjust the size, color, and text color of the switch component.

Installation

To install the Angular UI Switch Component, you can use npm or yarn. Here are the steps:

  1. Using npm:
npm install ngx-ui-switch --save
  1. Using yarn:
yarn add ngx-ui-switch

Ensure to import the component into a module as needed and include the default CSS file in your project. You can also configure global settings to customize the behavior of the switch.

Summary

The Angular UI Switch Component provides a sleek and customizable switch component for Angular applications. With features like CSS styling, switch content labels, global options, and two-way binding capability, this component offers a convenient way to integrate toggle switches seamlessly. By following the installation guide and exploring the various customization options available, developers can enhance the user experience of their Angular projects with this user-friendly switch component.