Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
NativeScript + Bootstrap + Angular 2 - Simple Radio Button
import { Component } from "@angular/core";
const defaultCssClass = " btn btn-secondary round-button ";
const activeCssClass = " btn btn-primary round-button active ";
@Component({
template: `<StackLayout>
<WrapLayout orientation="horizontal">
<Label [text]="radioText" textWrap="true" style="font-size: 24px;"></Label>
<Button text="" (tap)="onClick()" [class]="btnClass" ></Button>
</WrapLayout>
</StackLayout>`,
styles: [`.round-button { width: 30px;
height: 30px;
margin-left: 5%;
border-radius: 15px;
border-width: 2px;
border-color: solid black; } `]
})
export class RadioButtonComponent {
btnClass = defaultCssClass;
radioText = " Radio Button random text";
isSelected = false;
constructor(){}
onClick(){
this.isSelected = !this.isSelected;
this.btnClass = this.isSelected? defaultCssClass : activeCssClass ;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment