leom-slide-toggle

<a href="https://www.npmjs.com/package/leom-slide-toggle"> <h1 align="center">leom-slide-toggle</h1> </a>

Usage no npm install needed!

<script type="module">
  import leomSlideToggle from 'https://cdn.skypack.dev/leom-slide-toggle';
</script>

README

leom-slide-toggle

Description

Simple slide component toggle to angular 4,5... using reactive form

Installing

$ npm install --save leom-slide-toggle

Quickstart

Import leom-slide-toggle module in Angular app.


import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';

import { SlideToogleModule } from 'leom-slide-toggle';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    FormsModule,
    ReactiveFormsModule,
    SlideToogleModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

Usage

app.component


import { Component, OnInit } from '@angular/core';
import { FormGroup, FormBuilder } from '@angular/forms';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit {

  formulario: FormGroup;

  constructor(
    private fb: FormBuilder
  ) { }

  ngOnInit() {

    this.formulario = this.fb.group({
      slide: [false]
    });

  }

}

app.component.html


<form [formGroup]='formulario' novalidate>

  <div class='form-group'>
    <app-slide-toogle slideToggleFormControlName='slide'></app-slide-toogle>
  </div>

</form>

Contact

Leonardo Marques leo220193@gmail.com