Bildet dynamisch eine Radio Input Gruppe, aufgrund der Parameter die dem Constructor verpasst werden (Sehe Initialisierung). Kann die ausrichtung zwischen horizontal und vertikal wechseln, Inputs hizufügen und entfernen, Werte als Input-Value oder Label-Value zurückgeben, „disabled“ und „checked“ Parameter manipulieren, einzelne inputs (un)sichtbar machen.
constructor(groupName: string, entries: RadioGroupEntry[], alignment?:string) { // ... body ...}
interface RadioGroupEntry {
value: string;
label: string;
}
entries: Array<RadioGroupEntry>
isMandatory: boolean = false;
Wenn ein Grouplabel(this.groupLabel) definiert ist => kreiert das Label, checkt die protected alignment:string Property (="vertikal" default) nach RegEx /^hor/i und ruft Funktionen auf, welche das Widget dementsprechend vertikal oder hotizontal bauen.
getName(): stringGibt das input Attribut "name" zurück, welches für die inputs gleich sein muss, damit sie zu derselben Gruppe gehören.
setName(name: string): voidSetzt protected groupName:string property und alle "name" Attribute der Inputs auf den Parameter-Wert.
getValue(asLabel?: boolean): stringGibt den Wert des ausgwählten RadioButtons zurück. Setze asLabel Parameter auf "true", um den Wert als Label zurück zu bekommen.
addValue(value?: string, label?: string): void
if (value || label) { let entry = { value: value, label: label }; ....... } Wenn kein Label angegeben ist, wird Value zu Label, wen kein Value angegeben ist, wird das Label zu Value. Das Ganze wird dem this.entries hinzugefügt und im HTML abgebildet.
if (!value && !label) { this.emit("no value")}
Fügen Sie einen völlig neuen Auswahloptionssatz hinzu und rendern Sie die RadioBox erneut.
removeValue(value?: string, label?: string): voidEntfernen Sie einen Wert aus den Auswahloptionen und rendern Sie die RadioBox erneut. Geben Sie dafür wahlweise value, label oder beides an.
setDisabled(value?: string, label?: string, bool: boolean = true): voidSet-unset "disabled" -Attribut für Inupt mit einem bestimmten Wert oder Label. Boolean Parameter true setzt "disabled" auf true und der entsprechende Labeltext bekommt "text-decoration: line-through;". Mit "false" bewirken Sie das Gegenteil.
setChecked(value?: string, label?: string, bool: boolean = true): voidSet-unset "checked" -Attribut für Inupt mit einem bestimmten Wert oder Label. Boolean Parameter true setzt "checked" auf true. Mit "false" bewirken Sie das Gegenteil.
setVisible(value?: string, label?: string, bool: boolean = true): voidVerstecken/zeigen Sie inputs mit einem bestimmten Wet oder Label. True == sichtbar, false == unsichtbar;
setAlignment(value: string): voidSetzt die protected alignment: string Property auf die angegebene String Value. Sie können da alles Erdenkliche reinschreiben. solange /^hor/i (wie "horizontal", z.B., oder einfach "hor") drinn ist, wird's horizontal gebaut, andernfalls vertikal.
changeAlignment(): voidWechselt die Ausrichtung von inputs: Horizontal auf Vertikal und umgekehrt.
setMandatoy(bMandatory:boolean = true): voidsetzt den Input required Attribut auf true, den Label Text Style auf "color:red;", den Input auf "w3-border-red w3-pale-red".
setLabel(label: string): voidSetzt das Label für die Gruppe und die protected this.groupLabel: string Property auf den Parameter-Wert.
getLabel(): stringLiefert this.groupLabel zurück.
setLabelVisible(visible: boolean = true):voidMacht das Label für die ganze Gruppe (un)sichtbar. true == sichtbar, false == nicht sichtbar.
removeLabel(): voidEntfernt das GruppenLabel.
_getNameAttr(), _setNameAttr(name: string), _getValueAttr(asLabel?: boolean), _setDisabledAttr(value?: string, label?: string, bool: boolean = true), _setCheckedAttr(value?: string, label?: string, bool: boolean = true), _setVisibleAttr(value?: string, label?: string, bool: boolean = true), _setAlignmentAttr(value: string), _setMandatoryAttr(bMandatory: boolean = true), _setLabelAttr(label: string): void, _getLabelAttr(): string.