Netgrif Components Core library Documentation
  1. Classes
  2. TextField

File

projects/netgrif-components-core/src/lib/data-fields/text-field/models/text-field.ts

Extends

DataField

Index

Properties
Methods

Constructor

constructor(stringId: string, title: string, value: string, behavior: Behavior, placeholder?: string, description?: string, layout?: Layout, validations?: Array<Validation>, _component?: Component, parentTaskId?: string)
Defined in projects/netgrif-components-core/src/lib/data-fields/text-field/models/text-field.ts:49
Parameters :
Name Type Optional
stringId string No
title string No
value string No
behavior Behavior No
placeholder string Yes
description string Yes
layout Layout Yes
validations Array<Validation> Yes
_component Component Yes
parentTaskId string Yes

Properties

Static FIELD_HEIGHT
Type : number
Default value : 67
Defined in projects/netgrif-components-core/src/lib/data-fields/text-field/models/text-field.ts:49
Protected _blockSubscription
Type : Subscription
Inherited from DataField
Defined in DataField:71
Protected _formControlValueSubscription
Type : Subscription
Inherited from DataField
Defined in DataField:73
Protected _initializedSubscription
Type : Subscription
Inherited from DataField
Defined in DataField:103

Stores the last subscription to the _initialized$ Stream, to prevent multiple block events from executing at the same time
Protected _localLayout
Type : Layout
Inherited from DataField
Defined in DataField:115

Stores a copy of the fields layout, that can be modified by the layouting algorithm as needed without affecting the base configuration.
Protected _myValueSubscription
Type : Subscription
Inherited from DataField
Defined in DataField:74
Protected _touchSubscription
Type : Subscription
Inherited from DataField
Defined in DataField:72
Protected _updateSubscription
Type : Subscription
Inherited from DataField
Defined in DataField:70
Protected _validators
Type : Array<ValidatorFn>
Inherited from DataField
Defined in DataField:97

Validators resolved from field validations
Protected layoutSubject
Type : BehaviorSubject<Layout>
Inherited from DataField
Defined in DataField:120

Listens for layout changes
Public Optional validations
Type : Array<Validation>
Inherited from DataField
Defined in DataField:152

Methods

Public getTypedComponentType
getTypedComponentType()
Inherited from DataField
Defined in DataField:57
Returns : string
Protected resolveValidations
resolveValidations()
Inherited from DataField
Defined in DataField:60
Returns : Array<ValidatorFn>
Protected _determineFormControlValidity
_determineFormControlValidity(formControl: FormControl)
Inherited from DataField
Defined in DataField:490

Computes whether the FormControl si valid.

Parameters :
Name Type Optional Description
formControl FormControl No

check form control
Returns : boolean
Public applyChange
applyChange(change: Change)
Inherited from DataField
Defined in DataField:555

Updates the state of this data field model object.

Also see ChangedFields.

Parameters :
Name Type Optional Description
change Change No
  • object describing the changes - returned from backend

Also see {
Returns : void
Protected calculateValidity
calculateValidity(forValidRequired: boolean, formControl: FormControl)
Inherited from DataField
Defined in DataField:598
Parameters :
Name Type Optional
forValidRequired boolean No
formControl FormControl No
Returns : boolean
Public clearValidators
clearValidators()
Inherited from DataField
Defined in DataField:530
Returns : void
Public componentChange$
componentChange$()
Inherited from DataField
Defined in DataField:307
Returns : Observable<Component>
Public destroy
destroy()
Inherited from DataField
Defined in DataField:393
Returns : void
Public disconnectFormControl
disconnectFormControl()
Inherited from DataField
Defined in DataField:433
Returns : void
Public focus
focus()
Inherited from DataField
Defined in DataField:357
Returns : void
Public getComponentType
getComponentType()
Inherited from DataField
Defined in DataField:387

This function resolve type of component for HTML

Returns : string

type of component in string
Public getUpdateOnStrategy
getUpdateOnStrategy()
Inherited from DataField
Defined in DataField:379
Returns : UpdateOnStrategy
Public isInvalid
isInvalid(formControl: FormControl)
Inherited from DataField
Defined in DataField:615
Parameters :
Name Type Optional
formControl FormControl No
Returns : boolean
Public registerFormControl
registerFormControl(formControl: FormControl)
Inherited from DataField
Defined in DataField:403
Parameters :
Name Type Optional
formControl FormControl No
Returns : void
Public replaceValidations
replaceValidations(validations: Array<Validation>)
Inherited from DataField
Defined in DataField:525
Parameters :
Name Type Optional
validations Array<Validation> No
Returns : void
Public resetLocalLayout
resetLocalLayout()
Inherited from DataField
Defined in DataField:622

Copies the layout settings into the local layout.

Returns : void
Public resolveAppearance
resolveAppearance(config: ConfigurationService)
Inherited from DataField
Defined in DataField:571
Parameters :
Name Type Optional
config ConfigurationService No
Returns : void
Protected resolveFormControlValidators
resolveFormControlValidators()
Inherited from DataField
Defined in DataField:506

Creates Validator objects based on field behavior. Only the required behavior is resolved by default. Required is resolved as Validators.required. If you need to resolve additional Validators or need a different resolution for the required Validator override this method.

See Behavior for information about data field behavior.

See ValidatorFn and Validators for information about Validators.

Alternatively see Form Validation guide from Angular.

Returns : Array<ValidatorFn>
Public resolvePrevValue
resolvePrevValue(value: T)
Inherited from DataField
Defined in DataField:591
Parameters :
Name Type Optional
value T No
Returns : void
Public revertToPreviousValue
revertToPreviousValue()
Inherited from DataField
Defined in DataField:311
Returns : void
Protected subscribeToInnerSubjects
subscribeToInnerSubjects(formControl: FormControl)
Inherited from DataField
Defined in DataField:458
Parameters :
Name Type Optional
formControl FormControl No
Returns : void
Public update
update()
Inherited from DataField
Defined in DataField:341
Returns : void
Protected updateFormControlState
updateFormControlState(formControl: FormControl)
Inherited from DataField
Defined in DataField:452
Parameters :
Name Type Optional
formControl FormControl No
Returns : void
Public valueChanges
valueChanges()
Inherited from DataField
Defined in DataField:345
Returns : Observable<T>
Protected valueEquality
valueEquality(a: T, b: T)
Inherited from DataField
Defined in DataField:545

Determines if two values of the data field are equal.

a === b equality is used by default. If you want different behavior override this method.

Parameters :
Name Type Optional Description
a T No
  • first compared value
b T No
  • second compared value
Returns : boolean
Public valueWithoutChange
valueWithoutChange(value: T)
Inherited from DataField
Defined in DataField:235
Parameters :
Name Type Optional
value T No
Returns : void 
import {Behavior} from '../../models/behavior';
import {FormControl, ValidatorFn, Validators} from '@angular/forms';
import {Layout} from '../../models/layout';
import {Validation} from '../../models/validation';
import {Component, ComponentPrefixes} from '../../models/component';
import {DataField} from '../../models/abstract-data-field';

export enum TextFieldView {
    DEFAULT = 'default',
    TEXTAREA = 'textarea',
    RICHTEXTAREA = 'richtextarea',
    HTMLTEXTAREA = 'htmltextarea'
}

/**
 * A collection of Text field component names supported by the application engine.
 */
export enum TextFieldComponent {
    PASSWORD = 'password',
    TEXT_AREA = 'textarea',
    RICH_TEXT_AREA = 'richtextarea',
    HTML_TEXT_AREA = 'htmltextarea',
    DASHBOARD_LINE_CHART = 'dashboard_line_chart',
    DASHBOARD_PIE_CHART = 'dashboard_pie_chart',
    DASHBOARD_BAR_CHART = 'dashboard_bar_chart',
    DASHBOARD_IFRAME = 'dashboard_iframe',
    DASHBOARD_PORTAL = 'dashboard_portal',
}

export enum TextAreaHeight {
    OUTLINE = 20,
    FILL_STANDARD = 22
}

export enum TextFieldValidation {
    REQUIRED = 'required',
    MIN_LENGTH = 'minLength',
    MAX_LENGTH = 'maxLength',
    VALID_MIN_LENGTH = 'minlength',
    VALID_MAX_LENGTH = 'maxlength',
    PATTERN = 'pattern',
    REGEX = 'regex',
    VALID_TEL_NUMBER = 'validTelNumber',
    TEL_NUMBER = 'telNumber',
    EMAIL = 'email'
}

export class TextField extends DataField<string> {
    public static FIELD_HEIGHT = 67;

    constructor(stringId: string, title: string, value: string, behavior: Behavior, placeholder?: string,
                description?: string, layout?: Layout, validations?: Array<Validation>, _component?: Component,
                parentTaskId?: string) {
        super(stringId, title, value, behavior, placeholder, description, layout, validations, _component, parentTaskId);
    }

    public getTypedComponentType(): string {
        return ComponentPrefixes.TEXT + this.getComponentType();
    }
    protected resolveValidations(): Array<ValidatorFn> {
        const result = [];

        this.validations.forEach(item => {
            if (item.validationRule.includes(TextFieldValidation.MIN_LENGTH)) {
                const tmp = item.validationRule.split(' ');
                if (tmp[1] !== undefined) {
                    const length = parseInt(tmp[1], 10);
                    if (!isNaN(length)) {
                        result.push(Validators.minLength(length));
                    }
                }
            } else if (item.validationRule.includes(TextFieldValidation.MAX_LENGTH)) {
                const tmp = item.validationRule.split(' ');
                if (tmp[1] !== undefined) {
                    const length = parseInt(tmp[1], 10);
                    if (!isNaN(length)) {
                        result.push(Validators.maxLength(length));
                    }
                }
            } else if (item.validationRule.includes(TextFieldValidation.REGEX)) {
                if (item.validationRule.startsWith('regex ')) {
                    result.push(Validators.pattern(new RegExp(item.validationRule.substring(6, item.validationRule.length ))));
                } else if (item.validationRule.startsWith('regex("')) {
                    result.push(Validators.pattern(new RegExp(item.validationRule.substring(7, item.validationRule.length - 2))));
                }
            } else if (item.validationRule.includes(TextFieldValidation.EMAIL)) {
                result.push(Validators.email);
            } else if (item.validationRule.includes(TextFieldValidation.TEL_NUMBER)) {
                result.push(this.validTelNumber);
            }
        });

        return result;
    }

    private validTelNumber(fc: FormControl) {
        if (!(new RegExp(/^(?:\+?(\d{1,3}))?([-. (]*(\d{3})[-. )]*)?((\d{3})[-. ]*(\d{2,4})(?:[-.x ]*(\d+))?)$/).test(fc.value))) {
            return ({validTelNumber: true});
        } else {
            return null;
        }
    }
}

result-matching ""

    No results matching ""