| 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711171217131714171517161717171817191720172117221723172417251726172717281729173017311732173317341735173617371738173917401741174217431744174517461747174817491750175117521753175417551756175717581759176017611762176317641765176617671768176917701771177217731774177517761777177817791780178117821783178417851786178717881789179017911792179317941795179617971798179918001801180218031804180518061807180818091810181118121813181418151816181718181819182018211822182318241825182618271828182918301831183218331834183518361837183818391840184118421843184418451846184718481849185018511852185318541855185618571858185918601861186218631864186518661867186818691870187118721873187418751876187718781879188018811882188318841885188618871888188918901891189218931894189518961897189818991900190119021903190419051906190719081909191019111912191319141915191619171918191919201921192219231924192519261927192819291930193119321933193419351936193719381939194019411942194319441945194619471948194919501951195219531954195519561957195819591960196119621963196419651966196719681969197019711972197319741975197619771978197919801981198219831984198519861987198819891990199119921993199419951996199719981999200020012002200320042005200620072008200920102011201220132014201520162017201820192020202120222023202420252026202720282029203020312032203320342035203620372038203920402041204220432044204520462047204820492050205120522053205420552056205720582059206020612062206320642065206620672068206920702071207220732074207520762077207820792080208120822083208420852086208720882089209020912092209320942095209620972098209921002101210221032104210521062107210821092110211121122113211421152116211721182119212021212122212321242125212621272128212921302131213221332134213521362137213821392140214121422143214421452146214721482149215021512152215321542155215621572158215921602161216221632164216521662167216821692170217121722173217421752176217721782179218021812182218321842185218621872188218921902191219221932194219521962197219821992200220122022203220422052206220722082209221022112212221322142215221622172218221922202221222222232224222522262227222822292230223122322233223422352236223722382239224022412242224322442245224622472248224922502251225222532254225522562257225822592260226122622263226422652266226722682269227022712272227322742275227622772278227922802281228222832284228522862287228822892290229122922293229422952296229722982299230023012302230323042305230623072308230923102311231223132314231523162317231823192320232123222323232423252326232723282329233023312332233323342335233623372338233923402341234223432344234523462347234823492350235123522353235423552356235723582359236023612362236323642365236623672368236923702371237223732374237523762377237823792380238123822383238423852386238723882389239023912392239323942395239623972398239924002401240224032404240524062407240824092410241124122413241424152416241724182419242024212422242324242425242624272428242924302431243224332434243524362437243824392440244124422443244424452446244724482449245024512452245324542455245624572458245924602461246224632464246524662467246824692470247124722473247424752476247724782479248024812482248324842485248624872488248924902491249224932494249524962497249824992500250125022503250425052506250725082509251025112512251325142515251625172518251925202521252225232524252525262527252825292530253125322533253425352536253725382539254025412542254325442545254625472548254925502551255225532554255525562557255825592560256125622563256425652566256725682569257025712572257325742575257625772578257925802581258225832584258525862587258825892590259125922593259425952596259725982599260026012602260326042605260626072608260926102611261226132614261526162617261826192620262126222623262426252626262726282629263026312632263326342635263626372638263926402641264226432644264526462647264826492650265126522653265426552656265726582659266026612662266326642665266626672668266926702671267226732674267526762677267826792680268126822683268426852686268726882689269026912692269326942695269626972698269927002701270227032704270527062707270827092710271127122713271427152716271727182719272027212722272327242725272627272728272927302731273227332734273527362737273827392740274127422743274427452746274727482749275027512752275327542755275627572758275927602761276227632764276527662767276827692770277127722773277427752776277727782779278027812782278327842785278627872788278927902791279227932794279527962797279827992800280128022803280428052806280728082809281028112812281328142815281628172818281928202821282228232824282528262827282828292830283128322833283428352836283728382839284028412842284328442845284628472848284928502851285228532854285528562857285828592860286128622863286428652866286728682869287028712872287328742875287628772878287928802881288228832884288528862887288828892890289128922893289428952896289728982899290029012902290329042905290629072908290929102911291229132914291529162917291829192920292129222923292429252926292729282929293029312932293329342935293629372938293929402941294229432944294529462947294829492950295129522953295429552956295729582959296029612962296329642965296629672968296929702971297229732974297529762977297829792980298129822983298429852986298729882989299029912992299329942995299629972998299930003001300230033004300530063007300830093010301130123013301430153016301730183019302030213022302330243025302630273028302930303031303230333034303530363037303830393040304130423043304430453046304730483049305030513052305330543055305630573058305930603061306230633064306530663067306830693070307130723073307430753076307730783079308030813082308330843085308630873088308930903091309230933094309530963097309830993100310131023103310431053106310731083109311031113112311331143115311631173118311931203121312231233124312531263127312831293130313131323133313431353136313731383139314031413142314331443145314631473148314931503151315231533154315531563157315831593160316131623163316431653166316731683169317031713172317331743175317631773178317931803181318231833184318531863187318831893190319131923193319431953196319731983199320032013202320332043205320632073208320932103211321232133214321532163217321832193220322132223223322432253226322732283229323032313232323332343235323632373238323932403241324232433244324532463247324832493250325132523253325432553256325732583259326032613262326332643265326632673268326932703271327232733274327532763277327832793280328132823283328432853286328732883289329032913292329332943295329632973298329933003301330233033304330533063307330833093310331133123313331433153316331733183319332033213322332333243325332633273328332933303331333233333334333533363337333833393340334133423343334433453346334733483349335033513352335333543355335633573358335933603361336233633364336533663367336833693370337133723373337433753376337733783379338033813382338333843385338633873388338933903391339233933394339533963397339833993400340134023403340434053406340734083409341034113412341334143415341634173418341934203421342234233424342534263427342834293430343134323433343434353436343734383439344034413442344334443445344634473448344934503451345234533454345534563457345834593460346134623463346434653466346734683469347034713472347334743475347634773478347934803481348234833484348534863487348834893490349134923493349434953496349734983499350035013502350335043505350635073508350935103511351235133514351535163517351835193520352135223523352435253526352735283529353035313532353335343535353635373538353935403541354235433544354535463547354835493550355135523553355435553556355735583559356035613562356335643565356635673568356935703571357235733574357535763577357835793580358135823583358435853586358735883589359035913592359335943595359635973598359936003601360236033604360536063607360836093610361136123613361436153616361736183619362036213622362336243625362636273628362936303631363236333634363536363637363836393640364136423643364436453646364736483649365036513652365336543655365636573658365936603661366236633664366536663667366836693670367136723673367436753676367736783679368036813682368336843685368636873688368936903691369236933694369536963697369836993700370137023703370437053706370737083709371037113712371337143715371637173718371937203721372237233724372537263727372837293730373137323733373437353736373737383739374037413742374337443745374637473748374937503751375237533754375537563757375837593760376137623763376437653766376737683769377037713772377337743775377637773778377937803781378237833784378537863787378837893790379137923793379437953796379737983799380038013802380338043805380638073808380938103811381238133814381538163817381838193820382138223823382438253826382738283829383038313832383338343835383638373838383938403841384238433844384538463847384838493850385138523853385438553856385738583859386038613862386338643865386638673868386938703871387238733874387538763877387838793880388138823883388438853886388738883889389038913892389338943895389638973898389939003901390239033904390539063907390839093910391139123913391439153916391739183919392039213922392339243925392639273928392939303931393239333934393539363937393839393940394139423943394439453946394739483949395039513952395339543955395639573958395939603961396239633964396539663967396839693970397139723973397439753976397739783979398039813982398339843985398639873988398939903991399239933994399539963997399839994000400140024003400440054006400740084009401040114012401340144015401640174018401940204021402240234024402540264027402840294030403140324033403440354036403740384039404040414042404340444045404640474048404940504051405240534054405540564057405840594060406140624063406440654066406740684069407040714072407340744075407640774078407940804081408240834084408540864087408840894090409140924093409440954096409740984099410041014102410341044105410641074108410941104111411241134114411541164117411841194120412141224123412441254126412741284129413041314132413341344135413641374138413941404141414241434144414541464147414841494150415141524153415441554156415741584159416041614162416341644165416641674168416941704171417241734174417541764177417841794180418141824183418441854186418741884189419041914192419341944195419641974198419942004201420242034204420542064207420842094210421142124213421442154216421742184219422042214222422342244225422642274228422942304231423242334234423542364237423842394240424142424243424442454246424742484249425042514252425342544255425642574258425942604261426242634264426542664267426842694270427142724273427442754276427742784279428042814282428342844285428642874288428942904291429242934294429542964297429842994300430143024303430443054306430743084309431043114312431343144315431643174318431943204321432243234324432543264327432843294330433143324333433443354336433743384339434043414342434343444345434643474348434943504351435243534354435543564357435843594360436143624363436443654366436743684369437043714372437343744375437643774378437943804381438243834384438543864387438843894390439143924393439443954396439743984399440044014402440344044405440644074408440944104411441244134414441544164417441844194420442144224423442444254426442744284429443044314432443344344435443644374438 |
- /**
- * @license Angular v8.1.0
- * (c) 2010-2019 Google LLC. https://angular.io/
- * License: MIT
- */
- import { AfterViewInit } from '@angular/core';
- import { ElementRef } from '@angular/core';
- import { EventEmitter } from '@angular/core';
- import { InjectionToken } from '@angular/core';
- import { Injector } from '@angular/core';
- import { ModuleWithProviders } from '@angular/core';
- import { Observable } from 'rxjs';
- import { OnChanges } from '@angular/core';
- import { OnDestroy } from '@angular/core';
- import { OnInit } from '@angular/core';
- import { Renderer2 } from '@angular/core';
- import { SimpleChanges } from '@angular/core';
- import { StaticProvider } from '@angular/core';
- import { Type } from '@angular/core';
- import { Version } from '@angular/core';
- /**
- * This is the base class for `FormControl`, `FormGroup`, and `FormArray`.
- *
- * It provides some of the shared behavior that all controls and groups of controls have, like
- * running validators, calculating status, and resetting state. It also defines the properties
- * that are shared between all sub-classes, like `value`, `valid`, and `dirty`. It shouldn't be
- * instantiated directly.
- *
- * @see [Forms Guide](/guide/forms)
- * @see [Reactive Forms Guide](/guide/reactive-forms)
- * @see [Dynamic Forms Guide](/guide/dynamic-form)
- *
- * @publicApi
- */
- export declare abstract class AbstractControl {
- validator: ValidatorFn | null;
- asyncValidator: AsyncValidatorFn | null;
- private _parent;
- private _asyncValidationSubscription;
- /**
- * The current value of the control.
- *
- * * For a `FormControl`, the current value.
- * * For an enabled `FormGroup`, the values of enabled controls as an object
- * with a key-value pair for each member of the group.
- * * For a disabled `FormGroup`, the values of all controls as an object
- * with a key-value pair for each member of the group.
- * * For a `FormArray`, the values of enabled controls as an array.
- *
- */
- readonly value: any;
- /**
- * Initialize the AbstractControl instance.
- *
- * @param validator The function that determines the synchronous validity of this control.
- * @param asyncValidator The function that determines the asynchronous validity of this
- * control.
- */
- constructor(validator: ValidatorFn | null, asyncValidator: AsyncValidatorFn | null);
- /**
- * The parent control.
- */
- readonly parent: FormGroup | FormArray;
- /**
- * The validation status of the control. There are four possible
- * validation status values:
- *
- * * **VALID**: This control has passed all validation checks.
- * * **INVALID**: This control has failed at least one validation check.
- * * **PENDING**: This control is in the midst of conducting a validation check.
- * * **DISABLED**: This control is exempt from validation checks.
- *
- * These status values are mutually exclusive, so a control cannot be
- * both valid AND invalid or invalid AND disabled.
- */
- readonly status: string;
- /**
- * A control is `valid` when its `status` is `VALID`.
- *
- * @see {@link AbstractControl.status}
- *
- * @returns True if the control has passed all of its validation tests,
- * false otherwise.
- */
- readonly valid: boolean;
- /**
- * A control is `invalid` when its `status` is `INVALID`.
- *
- * @see {@link AbstractControl.status}
- *
- * @returns True if this control has failed one or more of its validation checks,
- * false otherwise.
- */
- readonly invalid: boolean;
- /**
- * A control is `pending` when its `status` is `PENDING`.
- *
- * @see {@link AbstractControl.status}
- *
- * @returns True if this control is in the process of conducting a validation check,
- * false otherwise.
- */
- readonly pending: boolean;
- /**
- * A control is `disabled` when its `status` is `DISABLED`.
- *
- * Disabled controls are exempt from validation checks and
- * are not included in the aggregate value of their ancestor
- * controls.
- *
- * @see {@link AbstractControl.status}
- *
- * @returns True if the control is disabled, false otherwise.
- */
- readonly disabled: boolean;
- /**
- * A control is `enabled` as long as its `status` is not `DISABLED`.
- *
- * @returns True if the control has any status other than 'DISABLED',
- * false if the status is 'DISABLED'.
- *
- * @see {@link AbstractControl.status}
- *
- */
- readonly enabled: boolean;
- /**
- * An object containing any errors generated by failing validation,
- * or null if there are no errors.
- */
- readonly errors: ValidationErrors | null;
- /**
- * A control is `pristine` if the user has not yet changed
- * the value in the UI.
- *
- * @returns True if the user has not yet changed the value in the UI; compare `dirty`.
- * Programmatic changes to a control's value do not mark it dirty.
- */
- readonly pristine: boolean;
- /**
- * A control is `dirty` if the user has changed the value
- * in the UI.
- *
- * @returns True if the user has changed the value of this control in the UI; compare `pristine`.
- * Programmatic changes to a control's value do not mark it dirty.
- */
- readonly dirty: boolean;
- /**
- * True if the control is marked as `touched`.
- *
- * A control is marked `touched` once the user has triggered
- * a `blur` event on it.
- */
- readonly touched: boolean;
- /**
- * True if the control has not been marked as touched
- *
- * A control is `untouched` if the user has not yet triggered
- * a `blur` event on it.
- */
- readonly untouched: boolean;
- /**
- * A multicasting observable that emits an event every time the value of the control changes, in
- * the UI or programmatically.
- */
- readonly valueChanges: Observable<any>;
- /**
- * A multicasting observable that emits an event every time the validation `status` of the control
- * recalculates.
- *
- * @see {@link AbstractControl.status}
- *
- */
- readonly statusChanges: Observable<any>;
- /**
- * Reports the update strategy of the `AbstractControl` (meaning
- * the event on which the control updates itself).
- * Possible values: `'change'` | `'blur'` | `'submit'`
- * Default value: `'change'`
- */
- readonly updateOn: FormHooks;
- /**
- * Sets the synchronous validators that are active on this control. Calling
- * this overwrites any existing sync validators.
- */
- setValidators(newValidator: ValidatorFn | ValidatorFn[] | null): void;
- /**
- * Sets the async validators that are active on this control. Calling this
- * overwrites any existing async validators.
- */
- setAsyncValidators(newValidator: AsyncValidatorFn | AsyncValidatorFn[] | null): void;
- /**
- * Empties out the sync validator list.
- */
- clearValidators(): void;
- /**
- * Empties out the async validator list.
- */
- clearAsyncValidators(): void;
- /**
- * Marks the control as `touched`. A control is touched by focus and
- * blur events that do not change the value.
- *
- * @see `markAsUntouched()`
- * @see `markAsDirty()`
- * @see `markAsPristine()`
- *
- * @param opts Configuration options that determine how the control propagates changes
- * and emits events events after marking is applied.
- * * `onlySelf`: When true, mark only this control. When false or not supplied,
- * marks all direct ancestors. Default is false.
- */
- markAsTouched(opts?: {
- onlySelf?: boolean;
- }): void;
- /**
- * Marks the control and all its descendant controls as `touched`.
- * @see `markAsTouched()`
- */
- markAllAsTouched(): void;
- /**
- * Marks the control as `untouched`.
- *
- * If the control has any children, also marks all children as `untouched`
- * and recalculates the `touched` status of all parent controls.
- *
- * @see `markAsTouched()`
- * @see `markAsDirty()`
- * @see `markAsPristine()`
- *
- * @param opts Configuration options that determine how the control propagates changes
- * and emits events after the marking is applied.
- * * `onlySelf`: When true, mark only this control. When false or not supplied,
- * marks all direct ancestors. Default is false.
- */
- markAsUntouched(opts?: {
- onlySelf?: boolean;
- }): void;
- /**
- * Marks the control as `dirty`. A control becomes dirty when
- * the control's value is changed through the UI; compare `markAsTouched`.
- *
- * @see `markAsTouched()`
- * @see `markAsUntouched()`
- * @see `markAsPristine()`
- *
- * @param opts Configuration options that determine how the control propagates changes
- * and emits events after marking is applied.
- * * `onlySelf`: When true, mark only this control. When false or not supplied,
- * marks all direct ancestors. Default is false.
- */
- markAsDirty(opts?: {
- onlySelf?: boolean;
- }): void;
- /**
- * Marks the control as `pristine`.
- *
- * If the control has any children, marks all children as `pristine`,
- * and recalculates the `pristine` status of all parent
- * controls.
- *
- * @see `markAsTouched()`
- * @see `markAsUntouched()`
- * @see `markAsDirty()`
- *
- * @param opts Configuration options that determine how the control emits events after
- * marking is applied.
- * * `onlySelf`: When true, mark only this control. When false or not supplied,
- * marks all direct ancestors. Default is false..
- */
- markAsPristine(opts?: {
- onlySelf?: boolean;
- }): void;
- /**
- * Marks the control as `pending`.
- *
- * A control is pending while the control performs async validation.
- *
- * @see {@link AbstractControl.status}
- *
- * @param opts Configuration options that determine how the control propagates changes and
- * emits events after marking is applied.
- * * `onlySelf`: When true, mark only this control. When false or not supplied,
- * marks all direct ancestors. Default is false..
- * * `emitEvent`: When true or not supplied (the default), the `statusChanges`
- * observable emits an event with the latest status the control is marked pending.
- * When false, no events are emitted.
- *
- */
- markAsPending(opts?: {
- onlySelf?: boolean;
- emitEvent?: boolean;
- }): void;
- /**
- * Disables the control. This means the control is exempt from validation checks and
- * excluded from the aggregate value of any parent. Its status is `DISABLED`.
- *
- * If the control has children, all children are also disabled.
- *
- * @see {@link AbstractControl.status}
- *
- * @param opts Configuration options that determine how the control propagates
- * changes and emits events after the control is disabled.
- * * `onlySelf`: When true, mark only this control. When false or not supplied,
- * marks all direct ancestors. Default is false..
- * * `emitEvent`: When true or not supplied (the default), both the `statusChanges` and
- * `valueChanges`
- * observables emit events with the latest status and value when the control is disabled.
- * When false, no events are emitted.
- */
- disable(opts?: {
- onlySelf?: boolean;
- emitEvent?: boolean;
- }): void;
- /**
- * Enables the control. This means the control is included in validation checks and
- * the aggregate value of its parent. Its status recalculates based on its value and
- * its validators.
- *
- * By default, if the control has children, all children are enabled.
- *
- * @see {@link AbstractControl.status}
- *
- * @param opts Configure options that control how the control propagates changes and
- * emits events when marked as untouched
- * * `onlySelf`: When true, mark only this control. When false or not supplied,
- * marks all direct ancestors. Default is false..
- * * `emitEvent`: When true or not supplied (the default), both the `statusChanges` and
- * `valueChanges`
- * observables emit events with the latest status and value when the control is enabled.
- * When false, no events are emitted.
- */
- enable(opts?: {
- onlySelf?: boolean;
- emitEvent?: boolean;
- }): void;
- private _updateAncestors;
- /**
- * @param parent Sets the parent of the control
- */
- setParent(parent: FormGroup | FormArray): void;
- /**
- * Sets the value of the control. Abstract method (implemented in sub-classes).
- */
- abstract setValue(value: any, options?: Object): void;
- /**
- * Patches the value of the control. Abstract method (implemented in sub-classes).
- */
- abstract patchValue(value: any, options?: Object): void;
- /**
- * Resets the control. Abstract method (implemented in sub-classes).
- */
- abstract reset(value?: any, options?: Object): void;
- /**
- * Recalculates the value and validation status of the control.
- *
- * By default, it also updates the value and validity of its ancestors.
- *
- * @param opts Configuration options determine how the control propagates changes and emits events
- * after updates and validity checks are applied.
- * * `onlySelf`: When true, only update this control. When false or not supplied,
- * update all direct ancestors. Default is false..
- * * `emitEvent`: When true or not supplied (the default), both the `statusChanges` and
- * `valueChanges`
- * observables emit events with the latest status and value when the control is updated.
- * When false, no events are emitted.
- */
- updateValueAndValidity(opts?: {
- onlySelf?: boolean;
- emitEvent?: boolean;
- }): void;
- private _setInitialStatus;
- private _runValidator;
- private _runAsyncValidator;
- private _cancelExistingSubscription;
- /**
- * Sets errors on a form control when running validations manually, rather than automatically.
- *
- * Calling `setErrors` also updates the validity of the parent control.
- *
- * @usageNotes
- * ### Manually set the errors for a control
- *
- * ```
- * const login = new FormControl('someLogin');
- * login.setErrors({
- * notUnique: true
- * });
- *
- * expect(login.valid).toEqual(false);
- * expect(login.errors).toEqual({ notUnique: true });
- *
- * login.setValue('someOtherLogin');
- *
- * expect(login.valid).toEqual(true);
- * ```
- */
- setErrors(errors: ValidationErrors | null, opts?: {
- emitEvent?: boolean;
- }): void;
- /**
- * Retrieves a child control given the control's name or path.
- *
- * @param path A dot-delimited string or array of string/number values that define the path to the
- * control.
- *
- * @usageNotes
- * ### Retrieve a nested control
- *
- * For example, to get a `name` control nested within a `person` sub-group:
- *
- * * `this.form.get('person.name');`
- *
- * -OR-
- *
- * * `this.form.get(['person', 'name']);`
- */
- get(path: Array<string | number> | string): AbstractControl | null;
- /**
- * @description
- * Reports error data for the control with the given path.
- *
- * @param errorCode The code of the error to check
- * @param path A list of control names that designates how to move from the current control
- * to the control that should be queried for errors.
- *
- * @usageNotes
- * For example, for the following `FormGroup`:
- *
- * ```
- * form = new FormGroup({
- * address: new FormGroup({ street: new FormControl() })
- * });
- * ```
- *
- * The path to the 'street' control from the root form would be 'address' -> 'street'.
- *
- * It can be provided to this method in one of two formats:
- *
- * 1. An array of string control names, e.g. `['address', 'street']`
- * 1. A period-delimited list of control names in one string, e.g. `'address.street'`
- *
- * @returns error data for that particular error. If the control or error is not present,
- * null is returned.
- */
- getError(errorCode: string, path?: Array<string | number> | string): any;
- /**
- * @description
- * Reports whether the control with the given path has the error specified.
- *
- * @param errorCode The code of the error to check
- * @param path A list of control names that designates how to move from the current control
- * to the control that should be queried for errors.
- *
- * @usageNotes
- * For example, for the following `FormGroup`:
- *
- * ```
- * form = new FormGroup({
- * address: new FormGroup({ street: new FormControl() })
- * });
- * ```
- *
- * The path to the 'street' control from the root form would be 'address' -> 'street'.
- *
- * It can be provided to this method in one of two formats:
- *
- * 1. An array of string control names, e.g. `['address', 'street']`
- * 1. A period-delimited list of control names in one string, e.g. `'address.street'`
- *
- * If no path is given, this method checks for the error on the current control.
- *
- * @returns whether the given error is present in the control at the given path.
- *
- * If the control is not present, false is returned.
- */
- hasError(errorCode: string, path?: Array<string | number> | string): boolean;
- /**
- * Retrieves the top-level ancestor of this control.
- */
- readonly root: AbstractControl;
- private _calculateStatus;
- }
- /**
- * @description
- * Base class for control directives.
- *
- * This class is only used internally in the `ReactiveFormsModule` and the `FormsModule`.
- *
- * @publicApi
- */
- export declare abstract class AbstractControlDirective {
- /**
- * @description
- * A reference to the underlying control.
- *
- * @returns the control that backs this directive. Most properties fall through to that instance.
- */
- abstract readonly control: AbstractControl | null;
- /**
- * @description
- * Reports the value of the control if it is present, otherwise null.
- */
- readonly value: any;
- /**
- * @description
- * Reports whether the control is valid. A control is considered valid if no
- * validation errors exist with the current value.
- * If the control is not present, null is returned.
- */
- readonly valid: boolean | null;
- /**
- * @description
- * Reports whether the control is invalid, meaning that an error exists in the input value.
- * If the control is not present, null is returned.
- */
- readonly invalid: boolean | null;
- /**
- * @description
- * Reports whether a control is pending, meaning that that async validation is occurring and
- * errors are not yet available for the input value. If the control is not present, null is
- * returned.
- */
- readonly pending: boolean | null;
- /**
- * @description
- * Reports whether the control is disabled, meaning that the control is disabled
- * in the UI and is exempt from validation checks and excluded from aggregate
- * values of ancestor controls. If the control is not present, null is returned.
- */
- readonly disabled: boolean | null;
- /**
- * @description
- * Reports whether the control is enabled, meaning that the control is included in ancestor
- * calculations of validity or value. If the control is not present, null is returned.
- */
- readonly enabled: boolean | null;
- /**
- * @description
- * Reports the control's validation errors. If the control is not present, null is returned.
- */
- readonly errors: ValidationErrors | null;
- /**
- * @description
- * Reports whether the control is pristine, meaning that the user has not yet changed
- * the value in the UI. If the control is not present, null is returned.
- */
- readonly pristine: boolean | null;
- /**
- * @description
- * Reports whether the control is dirty, meaning that the user has changed
- * the value in the UI. If the control is not present, null is returned.
- */
- readonly dirty: boolean | null;
- /**
- * @description
- * Reports whether the control is touched, meaning that the user has triggered
- * a `blur` event on it. If the control is not present, null is returned.
- */
- readonly touched: boolean | null;
- /**
- * @description
- * Reports the validation status of the control. Possible values include:
- * 'VALID', 'INVALID', 'DISABLED', and 'PENDING'.
- * If the control is not present, null is returned.
- */
- readonly status: string | null;
- /**
- * @description
- * Reports whether the control is untouched, meaning that the user has not yet triggered
- * a `blur` event on it. If the control is not present, null is returned.
- */
- readonly untouched: boolean | null;
- /**
- * @description
- * Returns a multicasting observable that emits a validation status whenever it is
- * calculated for the control. If the control is not present, null is returned.
- */
- readonly statusChanges: Observable<any> | null;
- /**
- * @description
- * Returns a multicasting observable of value changes for the control that emits every time the
- * value of the control changes in the UI or programmatically.
- * If the control is not present, null is returned.
- */
- readonly valueChanges: Observable<any> | null;
- /**
- * @description
- * Returns an array that represents the path from the top-level form to this control.
- * Each index is the string name of the control on that level.
- */
- readonly path: string[] | null;
- /**
- * @description
- * Resets the control with the provided value if the control is present.
- */
- reset(value?: any): void;
- /**
- * @description
- * Reports whether the control with the given path has the error specified.
- *
- * @param errorCode The code of the error to check
- * @param path A list of control names that designates how to move from the current control
- * to the control that should be queried for errors.
- *
- * @usageNotes
- * For example, for the following `FormGroup`:
- *
- * ```
- * form = new FormGroup({
- * address: new FormGroup({ street: new FormControl() })
- * });
- * ```
- *
- * The path to the 'street' control from the root form would be 'address' -> 'street'.
- *
- * It can be provided to this method in one of two formats:
- *
- * 1. An array of string control names, e.g. `['address', 'street']`
- * 1. A period-delimited list of control names in one string, e.g. `'address.street'`
- *
- * If no path is given, this method checks for the error on the current control.
- *
- * @returns whether the given error is present in the control at the given path.
- *
- * If the control is not present, false is returned.
- */
- hasError(errorCode: string, path?: Array<string | number> | string): boolean;
- /**
- * @description
- * Reports error data for the control with the given path.
- *
- * @param errorCode The code of the error to check
- * @param path A list of control names that designates how to move from the current control
- * to the control that should be queried for errors.
- *
- * @usageNotes
- * For example, for the following `FormGroup`:
- *
- * ```
- * form = new FormGroup({
- * address: new FormGroup({ street: new FormControl() })
- * });
- * ```
- *
- * The path to the 'street' control from the root form would be 'address' -> 'street'.
- *
- * It can be provided to this method in one of two formats:
- *
- * 1. An array of string control names, e.g. `['address', 'street']`
- * 1. A period-delimited list of control names in one string, e.g. `'address.street'`
- *
- * @returns error data for that particular error. If the control or error is not present,
- * null is returned.
- */
- getError(errorCode: string, path?: Array<string | number> | string): any;
- }
- /**
- * Interface for options provided to an `AbstractControl`.
- *
- * @publicApi
- */
- export declare interface AbstractControlOptions {
- /**
- * @description
- * The list of validators applied to a control.
- */
- validators?: ValidatorFn | ValidatorFn[] | null;
- /**
- * @description
- * The list of async validators applied to control.
- */
- asyncValidators?: AsyncValidatorFn | AsyncValidatorFn[] | null;
- /**
- * @description
- * The event name for control to update upon.
- */
- updateOn?: 'change' | 'blur' | 'submit';
- }
- /**
- * @description
- * A base class for code shared between the `NgModelGroup` and `FormGroupName` directives.
- *
- * @publicApi
- */
- export declare class AbstractFormGroupDirective extends ControlContainer implements OnInit, OnDestroy {
- /**
- * @description
- * An internal callback method triggered on the instance after the inputs are set.
- * Registers the group with its parent group.
- */
- ngOnInit(): void;
- /**
- * @description
- * An internal callback method triggered before the instance is destroyed.
- * Removes the group from its parent group.
- */
- ngOnDestroy(): void;
- /**
- * @description
- * The `FormGroup` bound to this directive.
- */
- readonly control: FormGroup;
- /**
- * @description
- * The path to this group from the top-level directive.
- */
- readonly path: string[];
- /**
- * @description
- * The top-level directive for this group if present, otherwise null.
- */
- readonly formDirective: Form | null;
- /**
- * @description
- * The synchronous validators registered with this group.
- */
- readonly validator: ValidatorFn | null;
- /**
- * @description
- * The async validators registered with this group.
- */
- readonly asyncValidator: AsyncValidatorFn | null;
- }
- /**
- * @description
- * An interface implemented by classes that perform asynchronous validation.
- *
- * @usageNotes
- *
- * ### Provide a custom async validator directive
- *
- * The following example implements the `AsyncValidator` interface to create an
- * async validator directive with a custom error key.
- *
- * ```typescript
- * import { of as observableOf } from 'rxjs';
- *
- * @Directive({
- * selector: '[customAsyncValidator]',
- * providers: [{provide: NG_ASYNC_VALIDATORS, useExisting: CustomAsyncValidatorDirective, multi:
- * true}]
- * })
- * class CustomAsyncValidatorDirective implements AsyncValidator {
- * validate(control: AbstractControl): Observable<ValidationErrors|null> {
- * return observableOf({'custom': true});
- * }
- * }
- * ```
- *
- * @publicApi
- */
- export declare interface AsyncValidator extends Validator {
- /**
- * @description
- * Method that performs async validation against the provided control.
- *
- * @param control The control to validate against.
- *
- * @returns A promise or observable that resolves a map of validation errors
- * if validation fails, otherwise null.
- */
- validate(control: AbstractControl): Promise<ValidationErrors | null> | Observable<ValidationErrors | null>;
- }
- /**
- * @description
- * A function that receives a control and returns a Promise or observable
- * that emits validation errors if present, otherwise null.
- *
- * @publicApi
- */
- export declare interface AsyncValidatorFn {
- (control: AbstractControl): Promise<ValidationErrors | null> | Observable<ValidationErrors | null>;
- }
- /**
- * @description
- * A `ControlValueAccessor` for writing a value and listening to changes on a checkbox input
- * element.
- *
- * @usageNotes
- *
- * ### Using a checkbox with a reactive form.
- *
- * The following example shows how to use a checkbox with a reactive form.
- *
- * ```ts
- * const rememberLoginControl = new FormControl();
- * ```
- *
- * ```
- * <input type="checkbox" [formControl]="rememberLoginControl">
- * ```
- *
- * @ngModule ReactiveFormsModule
- * @ngModule FormsModule
- * @publicApi
- */
- export declare class CheckboxControlValueAccessor implements ControlValueAccessor {
- private _renderer;
- private _elementRef;
- /**
- * @description
- * The registered callback function called when a change event occurs on the input element.
- */
- onChange: (_: any) => void;
- /**
- * @description
- * The registered callback function called when a blur event occurs on the input element.
- */
- onTouched: () => void;
- constructor(_renderer: Renderer2, _elementRef: ElementRef);
- /**
- * Sets the "checked" property on the input element.
- *
- * @param value The checked value
- */
- writeValue(value: any): void;
- /**
- * @description
- * Registers a function called when the control value changes.
- *
- * @param fn The callback function
- */
- registerOnChange(fn: (_: any) => {}): void;
- /**
- * @description
- * Registers a function called when the control is touched.
- *
- * @param fn The callback function
- */
- registerOnTouched(fn: () => {}): void;
- /**
- * Sets the "disabled" property on the input element.
- *
- * @param isDisabled The disabled value
- */
- setDisabledState(isDisabled: boolean): void;
- }
- /**
- * A Directive that adds the `required` validator to checkbox controls marked with the
- * `required` attribute. The directive is provided with the `NG_VALIDATORS` multi-provider list.
- *
- * @see [Form Validation](guide/form-validation)
- *
- * @usageNotes
- *
- * ### Adding a required checkbox validator using template-driven forms
- *
- * The following example shows how to add a checkbox required validator to an input attached to an ngModel binding.
- *
- * ```
- * <input type="checkbox" name="active" ngModel required>
- * ```
- *
- * @publicApi
- * @ngModule FormsModule
- * @ngModule ReactiveFormsModule
- */
- export declare class CheckboxRequiredValidator extends RequiredValidator {
- /**
- * @description
- * Method that validates whether or not the checkbox has been checked.
- * Returns the validation result if enabled, otherwise null.
- */
- validate(control: AbstractControl): ValidationErrors | null;
- }
- /**
- * @description
- * Provide this token to control if form directives buffer IME input until
- * the "compositionend" event occurs.
- * @publicApi
- */
- export declare const COMPOSITION_BUFFER_MODE: InjectionToken<boolean>;
- /**
- * @description
- * A base class for directives that contain multiple registered instances of `NgControl`.
- * Only used by the forms module.
- *
- * @publicApi
- */
- export declare abstract class ControlContainer extends AbstractControlDirective {
- /**
- * @description
- * The name for the control
- */
- name: string;
- /**
- * @description
- * The top-level form directive for the control.
- */
- readonly formDirective: Form | null;
- /**
- * @description
- * The path to this group.
- */
- readonly path: string[] | null;
- }
- /**
- * @description
- * Defines an interface that acts as a bridge between the Angular forms API and a
- * native element in the DOM.
- *
- * Implement this interface to create a custom form control directive
- * that integrates with Angular forms.
- *
- * @see DefaultValueAccessor
- *
- * @publicApi
- */
- export declare interface ControlValueAccessor {
- /**
- * @description
- * Writes a new value to the element.
- *
- * This method is called by the forms API to write to the view when programmatic
- * changes from model to view are requested.
- *
- * @usageNotes
- * ### Write a value to the element
- *
- * The following example writes a value to the native DOM element.
- *
- * ```ts
- * writeValue(value: any): void {
- * this._renderer.setProperty(this._elementRef.nativeElement, 'value', value);
- * }
- * ```
- *
- * @param obj The new value for the element
- */
- writeValue(obj: any): void;
- /**
- * @description
- * Registers a callback function that is called when the control's value
- * changes in the UI.
- *
- * This method is called by the forms API on initialization to update the form
- * model when values propagate from the view to the model.
- *
- * When implementing the `registerOnChange` method in your own value accessor,
- * save the given function so your class calls it at the appropriate time.
- *
- * @usageNotes
- * ### Store the change function
- *
- * The following example stores the provided function as an internal method.
- *
- * ```ts
- * registerOnChange(fn: (_: any) => void): void {
- * this._onChange = fn;
- * }
- * ```
- *
- * When the value changes in the UI, call the registered
- * function to allow the forms API to update itself:
- *
- * ```ts
- * host: {
- * '(change)': '_onChange($event.target.value)'
- * }
- * ```
- *
- * @param fn The callback function to register
- */
- registerOnChange(fn: any): void;
- /**
- * @description
- * Registers a callback function is called by the forms API on initialization
- * to update the form model on blur.
- *
- * When implementing `registerOnTouched` in your own value accessor, save the given
- * function so your class calls it when the control should be considered
- * blurred or "touched".
- *
- * @usageNotes
- * ### Store the callback function
- *
- * The following example stores the provided function as an internal method.
- *
- * ```ts
- * registerOnTouched(fn: any): void {
- * this._onTouched = fn;
- * }
- * ```
- *
- * On blur (or equivalent), your class should call the registered function to allow
- * the forms API to update itself:
- *
- * ```ts
- * host: {
- * '(blur)': '_onTouched()'
- * }
- * ```
- *
- * @param fn The callback function to register
- */
- registerOnTouched(fn: any): void;
- /**
- * @description
- * Function that is called by the forms API when the control status changes to
- * or from 'DISABLED'. Depending on the status, it enables or disables the
- * appropriate DOM element.
- *
- * @usageNotes
- * The following is an example of writing the disabled property to a native DOM element:
- *
- * ```ts
- * setDisabledState(isDisabled: boolean): void {
- * this._renderer.setProperty(this._elementRef.nativeElement, 'disabled', isDisabled);
- * }
- * ```
- *
- * @param isDisabled The disabled status to set on the element
- */
- setDisabledState?(isDisabled: boolean): void;
- }
- /**
- * @description
- * The default `ControlValueAccessor` for writing a value and listening to changes on input
- * elements. The accessor is used by the `FormControlDirective`, `FormControlName`, and
- * `NgModel` directives.
- *
- * @usageNotes
- *
- * ### Using the default value accessor
- *
- * The following example shows how to use an input element that activates the default value accessor
- * (in this case, a text field).
- *
- * ```ts
- * const firstNameControl = new FormControl();
- * ```
- *
- * ```
- * <input type="text" [formControl]="firstNameControl">
- * ```
- *
- * @ngModule ReactiveFormsModule
- * @ngModule FormsModule
- * @publicApi
- */
- export declare class DefaultValueAccessor implements ControlValueAccessor {
- private _renderer;
- private _elementRef;
- private _compositionMode;
- /**
- * @description
- * The registered callback function called when an input event occurs on the input element.
- */
- onChange: (_: any) => void;
- /**
- * @description
- * The registered callback function called when a blur event occurs on the input element.
- */
- onTouched: () => void;
- /** Whether the user is creating a composition string (IME events). */
- private _composing;
- constructor(_renderer: Renderer2, _elementRef: ElementRef, _compositionMode: boolean);
- /**
- * Sets the "value" property on the input element.
- *
- * @param value The checked value
- */
- writeValue(value: any): void;
- /**
- * @description
- * Registers a function called when the control value changes.
- *
- * @param fn The callback function
- */
- registerOnChange(fn: (_: any) => void): void;
- /**
- * @description
- * Registers a function called when the control is touched.
- *
- * @param fn The callback function
- */
- registerOnTouched(fn: () => void): void;
- /**
- * Sets the "disabled" property on the input element.
- *
- * @param isDisabled The disabled value
- */
- setDisabledState(isDisabled: boolean): void;
- }
- /**
- * A directive that adds the `email` validator to controls marked with the
- * `email` attribute. The directive is provided with the `NG_VALIDATORS` multi-provider list.
- *
- * @see [Form Validation](guide/form-validation)
- *
- * @usageNotes
- *
- * ### Adding an email validator
- *
- * The following example shows how to add an email validator to an input attached to an ngModel binding.
- *
- * ```
- * <input type="email" name="email" ngModel email>
- * <input type="email" name="email" ngModel email="true">
- * <input type="email" name="email" ngModel [email]="true">
- * ```
- *
- * @publicApi
- * @ngModule FormsModule
- * @ngModule ReactiveFormsModule
- */
- export declare class EmailValidator implements Validator {
- private _enabled;
- private _onChange;
- /**
- * @description
- * Tracks changes to the email attribute bound to this directive.
- */
- email: boolean | string;
- /**
- * @description
- * Method that validates whether an email address is valid.
- * Returns the validation result if enabled, otherwise null.
- */
- validate(control: AbstractControl): ValidationErrors | null;
- /**
- * @description
- * Registers a callback function to call when the validator inputs change.
- *
- * @param fn The callback function
- */
- registerOnValidatorChange(fn: () => void): void;
- }
- /**
- * @description
- * An interface implemented by `FormGroupDirective` and `NgForm` directives.
- *
- * Only used by the `ReactiveFormsModule` and `FormsModule`.
- *
- * @publicApi
- */
- export declare interface Form {
- /**
- * @description
- * Add a control to this form.
- *
- * @param dir The control directive to add to the form.
- */
- addControl(dir: NgControl): void;
- /**
- * @description
- * Remove a control from this form.
- *
- * @param dir: The control directive to remove from the form.
- */
- removeControl(dir: NgControl): void;
- /**
- * @description
- * The control directive from which to get the `FormControl`.
- *
- * @param dir: The control directive.
- */
- getControl(dir: NgControl): FormControl;
- /**
- * @description
- * Add a group of controls to this form.
- *
- * @param dir: The control group directive to add.
- */
- addFormGroup(dir: AbstractFormGroupDirective): void;
- /**
- * @description
- * Remove a group of controls to this form.
- *
- * @param dir: The control group directive to remove.
- */
- removeFormGroup(dir: AbstractFormGroupDirective): void;
- /**
- * @description
- * The `FormGroup` associated with a particular `AbstractFormGroupDirective`.
- *
- * @param dir: The form group directive from which to get the `FormGroup`.
- */
- getFormGroup(dir: AbstractFormGroupDirective): FormGroup;
- /**
- * @description
- * Update the model for a particular control with a new value.
- *
- * @param dir: The control directive to update.
- * @param value: The new value for the control.
- */
- updateModel(dir: NgControl, value: any): void;
- }
- /**
- * Tracks the value and validity state of an array of `FormControl`,
- * `FormGroup` or `FormArray` instances.
- *
- * A `FormArray` aggregates the values of each child `FormControl` into an array.
- * It calculates its status by reducing the status values of its children. For example, if one of
- * the controls in a `FormArray` is invalid, the entire array becomes invalid.
- *
- * `FormArray` is one of the three fundamental building blocks used to define forms in Angular,
- * along with `FormControl` and `FormGroup`.
- *
- * @usageNotes
- *
- * ### Create an array of form controls
- *
- * ```
- * const arr = new FormArray([
- * new FormControl('Nancy', Validators.minLength(2)),
- * new FormControl('Drew'),
- * ]);
- *
- * console.log(arr.value); // ['Nancy', 'Drew']
- * console.log(arr.status); // 'VALID'
- * ```
- *
- * ### Create a form array with array-level validators
- *
- * You include array-level validators and async validators. These come in handy
- * when you want to perform validation that considers the value of more than one child
- * control.
- *
- * The two types of validators are passed in separately as the second and third arg
- * respectively, or together as part of an options object.
- *
- * ```
- * const arr = new FormArray([
- * new FormControl('Nancy'),
- * new FormControl('Drew')
- * ], {validators: myValidator, asyncValidators: myAsyncValidator});
- * ```
- *
- * ### Set the updateOn property for all controls in a form array
- *
- * The options object is used to set a default value for each child
- * control's `updateOn` property. If you set `updateOn` to `'blur'` at the
- * array level, all child controls default to 'blur', unless the child
- * has explicitly specified a different `updateOn` value.
- *
- * ```ts
- * const arr = new FormArray([
- * new FormControl()
- * ], {updateOn: 'blur'});
- * ```
- *
- * ### Adding or removing controls from a form array
- *
- * To change the controls in the array, use the `push`, `insert`, `removeAt` or `clear` methods
- * in `FormArray` itself. These methods ensure the controls are properly tracked in the
- * form's hierarchy. Do not modify the array of `AbstractControl`s used to instantiate
- * the `FormArray` directly, as that result in strange and unexpected behavior such
- * as broken change detection.
- *
- * @publicApi
- */
- export declare class FormArray extends AbstractControl {
- controls: AbstractControl[];
- /**
- * Creates a new `FormArray` instance.
- *
- * @param controls An array of child controls. Each child control is given an index
- * where it is registered.
- *
- * @param validatorOrOpts A synchronous validator function, or an array of
- * such functions, or an `AbstractControlOptions` object that contains validation functions
- * and a validation trigger.
- *
- * @param asyncValidator A single async validator or array of async validator functions
- *
- */
- constructor(controls: AbstractControl[], validatorOrOpts?: ValidatorFn | ValidatorFn[] | AbstractControlOptions | null, asyncValidator?: AsyncValidatorFn | AsyncValidatorFn[] | null);
- /**
- * Get the `AbstractControl` at the given `index` in the array.
- *
- * @param index Index in the array to retrieve the control
- */
- at(index: number): AbstractControl;
- /**
- * Insert a new `AbstractControl` at the end of the array.
- *
- * @param control Form control to be inserted
- */
- push(control: AbstractControl): void;
- /**
- * Insert a new `AbstractControl` at the given `index` in the array.
- *
- * @param index Index in the array to insert the control
- * @param control Form control to be inserted
- */
- insert(index: number, control: AbstractControl): void;
- /**
- * Remove the control at the given `index` in the array.
- *
- * @param index Index in the array to remove the control
- */
- removeAt(index: number): void;
- /**
- * Replace an existing control.
- *
- * @param index Index in the array to replace the control
- * @param control The `AbstractControl` control to replace the existing control
- */
- setControl(index: number, control: AbstractControl): void;
- /**
- * Length of the control array.
- */
- readonly length: number;
- /**
- * Sets the value of the `FormArray`. It accepts an array that matches
- * the structure of the control.
- *
- * This method performs strict checks, and throws an error if you try
- * to set the value of a control that doesn't exist or if you exclude the
- * value of a control.
- *
- * @usageNotes
- * ### Set the values for the controls in the form array
- *
- * ```
- * const arr = new FormArray([
- * new FormControl(),
- * new FormControl()
- * ]);
- * console.log(arr.value); // [null, null]
- *
- * arr.setValue(['Nancy', 'Drew']);
- * console.log(arr.value); // ['Nancy', 'Drew']
- * ```
- *
- * @param value Array of values for the controls
- * @param options Configure options that determine how the control propagates changes and
- * emits events after the value changes
- *
- * * `onlySelf`: When true, each change only affects this control, and not its parent. Default
- * is false.
- * * `emitEvent`: When true or not supplied (the default), both the `statusChanges` and
- * `valueChanges`
- * observables emit events with the latest status and value when the control value is updated.
- * When false, no events are emitted.
- * The configuration options are passed to the {@link AbstractControl#updateValueAndValidity
- * updateValueAndValidity} method.
- */
- setValue(value: any[], options?: {
- onlySelf?: boolean;
- emitEvent?: boolean;
- }): void;
- /**
- * Patches the value of the `FormArray`. It accepts an array that matches the
- * structure of the control, and does its best to match the values to the correct
- * controls in the group.
- *
- * It accepts both super-sets and sub-sets of the array without throwing an error.
- *
- * @usageNotes
- * ### Patch the values for controls in a form array
- *
- * ```
- * const arr = new FormArray([
- * new FormControl(),
- * new FormControl()
- * ]);
- * console.log(arr.value); // [null, null]
- *
- * arr.patchValue(['Nancy']);
- * console.log(arr.value); // ['Nancy', null]
- * ```
- *
- * @param value Array of latest values for the controls
- * @param options Configure options that determine how the control propagates changes and
- * emits events after the value changes
- *
- * * `onlySelf`: When true, each change only affects this control, and not its parent. Default
- * is false.
- * * `emitEvent`: When true or not supplied (the default), both the `statusChanges` and
- * `valueChanges`
- * observables emit events with the latest status and value when the control value is updated.
- * When false, no events are emitted.
- * The configuration options are passed to the {@link AbstractControl#updateValueAndValidity
- * updateValueAndValidity} method.
- */
- patchValue(value: any[], options?: {
- onlySelf?: boolean;
- emitEvent?: boolean;
- }): void;
- /**
- * Resets the `FormArray` and all descendants are marked `pristine` and `untouched`, and the
- * value of all descendants to null or null maps.
- *
- * You reset to a specific form state by passing in an array of states
- * that matches the structure of the control. The state is a standalone value
- * or a form state object with both a value and a disabled status.
- *
- * @usageNotes
- * ### Reset the values in a form array
- *
- * ```ts
- * const arr = new FormArray([
- * new FormControl(),
- * new FormControl()
- * ]);
- * arr.reset(['name', 'last name']);
- *
- * console.log(this.arr.value); // ['name', 'last name']
- * ```
- *
- * ### Reset the values in a form array and the disabled status for the first control
- *
- * ```
- * this.arr.reset([
- * {value: 'name', disabled: true},
- * 'last'
- * ]);
- *
- * console.log(this.arr.value); // ['name', 'last name']
- * console.log(this.arr.get(0).status); // 'DISABLED'
- * ```
- *
- * @param value Array of values for the controls
- * @param options Configure options that determine how the control propagates changes and
- * emits events after the value changes
- *
- * * `onlySelf`: When true, each change only affects this control, and not its parent. Default
- * is false.
- * * `emitEvent`: When true or not supplied (the default), both the `statusChanges` and
- * `valueChanges`
- * observables emit events with the latest status and value when the control is reset.
- * When false, no events are emitted.
- * The configuration options are passed to the {@link AbstractControl#updateValueAndValidity
- * updateValueAndValidity} method.
- */
- reset(value?: any, options?: {
- onlySelf?: boolean;
- emitEvent?: boolean;
- }): void;
- /**
- * The aggregate value of the array, including any disabled controls.
- *
- * Reports all values regardless of disabled status.
- * For enabled controls only, the `value` property is the best way to get the value of the array.
- */
- getRawValue(): any[];
- /**
- * Remove all controls in the `FormArray`.
- *
- * @usageNotes
- * ### Remove all elements from a FormArray
- *
- * ```ts
- * const arr = new FormArray([
- * new FormControl(),
- * new FormControl()
- * ]);
- * console.log(arr.length); // 2
- *
- * arr.clear();
- * console.log(arr.length); // 0
- * ```
- *
- * It's a simpler and more efficient alternative to removing all elements one by one:
- *
- * ```ts
- * const arr = new FormArray([
- * new FormControl(),
- * new FormControl()
- * ]);
- *
- * while (arr.length) {
- * arr.removeAt(0);
- * }
- * ```
- */
- clear(): void;
- private _registerControl;
- }
- /**
- * @description
- *
- * Syncs a nested `FormArray` to a DOM element.
- *
- * This directive is designed to be used with a parent `FormGroupDirective` (selector:
- * `[formGroup]`).
- *
- * It accepts the string name of the nested `FormArray` you want to link, and
- * will look for a `FormArray` registered with that name in the parent
- * `FormGroup` instance you passed into `FormGroupDirective`.
- *
- * @see [Reactive Forms Guide](guide/reactive-forms)
- * @see `AbstractControl`
- *
- * @usageNotes
- *
- * ### Example
- *
- * {@example forms/ts/nestedFormArray/nested_form_array_example.ts region='Component'}
- *
- * @ngModule ReactiveFormsModule
- * @publicApi
- */
- export declare class FormArrayName extends ControlContainer implements OnInit, OnDestroy {
- /**
- * @description
- * Tracks the name of the `FormArray` bound to the directive. The name corresponds
- * to a key in the parent `FormGroup` or `FormArray`.
- */
- name: string;
- constructor(parent: ControlContainer, validators: any[], asyncValidators: any[]);
- /**
- * @description
- * A lifecycle method called when the directive's inputs are initialized. For internal use only.
- *
- * @throws If the directive does not have a valid parent.
- */
- ngOnInit(): void;
- /**
- * @description
- * A lifecycle method called before the directive's instance is destroyed. For internal use only.
- */
- ngOnDestroy(): void;
- /**
- * @description
- * The `FormArray` bound to this directive.
- */
- readonly control: FormArray;
- /**
- * @description
- * The top-level directive for this group if present, otherwise null.
- */
- readonly formDirective: FormGroupDirective | null;
- /**
- * @description
- * Returns an array that represents the path from the top-level form to this control.
- * Each index is the string name of the control on that level.
- */
- readonly path: string[];
- /**
- * @description
- * Synchronous validator function composed of all the synchronous validators registered with this
- * directive.
- */
- readonly validator: ValidatorFn | null;
- /**
- * @description
- * Async validator function composed of all the async validators registered with this directive.
- */
- readonly asyncValidator: AsyncValidatorFn | null;
- private _checkParentType;
- }
- /**
- * @description
- * Creates an `AbstractControl` from a user-specified configuration.
- *
- * The `FormBuilder` provides syntactic sugar that shortens creating instances of a `FormControl`,
- * `FormGroup`, or `FormArray`. It reduces the amount of boilerplate needed to build complex
- * forms.
- *
- * @see [Reactive Forms Guide](/guide/reactive-forms)
- *
- * @publicApi
- */
- export declare class FormBuilder {
- /**
- * @description
- * Construct a new `FormGroup` instance.
- *
- * @param controlsConfig A collection of child controls. The key for each child is the name
- * under which it is registered.
- *
- * @param options Configuration options object for the `FormGroup`. The object can
- * have two shapes:
- *
- * 1) `AbstractControlOptions` object (preferred), which consists of:
- * * `validators`: A synchronous validator function, or an array of validator functions
- * * `asyncValidators`: A single async validator or array of async validator functions
- * * `updateOn`: The event upon which the control should be updated (options: 'change' | 'blur' |
- * submit')
- *
- * 2) Legacy configuration object, which consists of:
- * * `validator`: A synchronous validator function, or an array of validator functions
- * * `asyncValidator`: A single async validator or array of async validator functions
- *
- */
- group(controlsConfig: {
- [key: string]: any;
- }, options?: AbstractControlOptions | {
- [key: string]: any;
- } | null): FormGroup;
- /**
- * @description
- * Construct a new `FormControl` with the given state, validators and options.
- *
- * @param formState Initializes the control with an initial state value, or
- * with an object that contains both a value and a disabled status.
- *
- * @param validatorOrOpts A synchronous validator function, or an array of
- * such functions, or an `AbstractControlOptions` object that contains
- * validation functions and a validation trigger.
- *
- * @param asyncValidator A single async validator or array of async validator
- * functions.
- *
- * @usageNotes
- *
- * ### Initialize a control as disabled
- *
- * The following example returns a control with an initial value in a disabled state.
- *
- * <code-example path="forms/ts/formBuilder/form_builder_example.ts"
- * linenums="false" region="disabled-control">
- * </code-example>
- */
- control(formState: any, validatorOrOpts?: ValidatorFn | ValidatorFn[] | AbstractControlOptions | null, asyncValidator?: AsyncValidatorFn | AsyncValidatorFn[] | null): FormControl;
- /**
- * Constructs a new `FormArray` from the given array of configurations,
- * validators and options.
- *
- * @param controlsConfig An array of child controls or control configs. Each
- * child control is given an index when it is registered.
- *
- * @param validatorOrOpts A synchronous validator function, or an array of
- * such functions, or an `AbstractControlOptions` object that contains
- * validation functions and a validation trigger.
- *
- * @param asyncValidator A single async validator or array of async validator
- * functions.
- */
- array(controlsConfig: any[], validatorOrOpts?: ValidatorFn | ValidatorFn[] | AbstractControlOptions | null, asyncValidator?: AsyncValidatorFn | AsyncValidatorFn[] | null): FormArray;
- }
- /**
- * Tracks the value and validation status of an individual form control.
- *
- * This is one of the three fundamental building blocks of Angular forms, along with
- * `FormGroup` and `FormArray`. It extends the `AbstractControl` class that
- * implements most of the base functionality for accessing the value, validation status,
- * user interactions and events.
- *
- * @see `AbstractControl`
- * @see [Reactive Forms Guide](guide/reactive-forms)
- * @see [Usage Notes](#usage-notes)
- *
- * @usageNotes
- *
- * ### Initializing Form Controls
- *
- * Instantiate a `FormControl`, with an initial value.
- *
- * ```ts
- * const control = new FormControl('some value');
- * console.log(control.value); // 'some value'
- *```
- *
- * The following example initializes the control with a form state object. The `value`
- * and `disabled` keys are required in this case.
- *
- * ```ts
- * const control = new FormControl({ value: 'n/a', disabled: true });
- * console.log(control.value); // 'n/a'
- * console.log(control.status); // 'DISABLED'
- * ```
- *
- * The following example initializes the control with a sync validator.
- *
- * ```ts
- * const control = new FormControl('', Validators.required);
- * console.log(control.value); // ''
- * console.log(control.status); // 'INVALID'
- * ```
- *
- * The following example initializes the control using an options object.
- *
- * ```ts
- * const control = new FormControl('', {
- * validators: Validators.required,
- * asyncValidators: myAsyncValidator
- * });
- * ```
- *
- * ### Configure the control to update on a blur event
- *
- * Set the `updateOn` option to `'blur'` to update on the blur `event`.
- *
- * ```ts
- * const control = new FormControl('', { updateOn: 'blur' });
- * ```
- *
- * ### Configure the control to update on a submit event
- *
- * Set the `updateOn` option to `'submit'` to update on a submit `event`.
- *
- * ```ts
- * const control = new FormControl('', { updateOn: 'submit' });
- * ```
- *
- * ### Reset the control back to an initial value
- *
- * You reset to a specific form state by passing through a standalone
- * value or a form state object that contains both a value and a disabled state
- * (these are the only two properties that cannot be calculated).
- *
- * ```ts
- * const control = new FormControl('Nancy');
- *
- * console.log(control.value); // 'Nancy'
- *
- * control.reset('Drew');
- *
- * console.log(control.value); // 'Drew'
- * ```
- *
- * ### Reset the control back to an initial value and disabled
- *
- * ```
- * const control = new FormControl('Nancy');
- *
- * console.log(control.value); // 'Nancy'
- * console.log(control.status); // 'VALID'
- *
- * control.reset({ value: 'Drew', disabled: true });
- *
- * console.log(control.value); // 'Drew'
- * console.log(control.status); // 'DISABLED'
- * ```
- *
- * @publicApi
- */
- export declare class FormControl extends AbstractControl {
- /**
- * Creates a new `FormControl` instance.
- *
- * @param formState Initializes the control with an initial value,
- * or an object that defines the initial value and disabled state.
- *
- * @param validatorOrOpts A synchronous validator function, or an array of
- * such functions, or an `AbstractControlOptions` object that contains validation functions
- * and a validation trigger.
- *
- * @param asyncValidator A single async validator or array of async validator functions
- *
- */
- constructor(formState?: any, validatorOrOpts?: ValidatorFn | ValidatorFn[] | AbstractControlOptions | null, asyncValidator?: AsyncValidatorFn | AsyncValidatorFn[] | null);
- /**
- * Sets a new value for the form control.
- *
- * @param value The new value for the control.
- * @param options Configuration options that determine how the control propagates changes
- * and emits events when the value changes.
- * The configuration options are passed to the {@link AbstractControl#updateValueAndValidity
- * updateValueAndValidity} method.
- *
- * * `onlySelf`: When true, each change only affects this control, and not its parent. Default is
- * false.
- * * `emitEvent`: When true or not supplied (the default), both the `statusChanges` and
- * `valueChanges`
- * observables emit events with the latest status and value when the control value is updated.
- * When false, no events are emitted.
- * * `emitModelToViewChange`: When true or not supplied (the default), each change triggers an
- * `onChange` event to
- * update the view.
- * * `emitViewToModelChange`: When true or not supplied (the default), each change triggers an
- * `ngModelChange`
- * event to update the model.
- *
- */
- setValue(value: any, options?: {
- onlySelf?: boolean;
- emitEvent?: boolean;
- emitModelToViewChange?: boolean;
- emitViewToModelChange?: boolean;
- }): void;
- /**
- * Patches the value of a control.
- *
- * This function is functionally the same as {@link FormControl#setValue setValue} at this level.
- * It exists for symmetry with {@link FormGroup#patchValue patchValue} on `FormGroups` and
- * `FormArrays`, where it does behave differently.
- *
- * @see `setValue` for options
- */
- patchValue(value: any, options?: {
- onlySelf?: boolean;
- emitEvent?: boolean;
- emitModelToViewChange?: boolean;
- emitViewToModelChange?: boolean;
- }): void;
- /**
- * Resets the form control, marking it `pristine` and `untouched`, and setting
- * the value to null.
- *
- * @param formState Resets the control with an initial value,
- * or an object that defines the initial value and disabled state.
- *
- * @param options Configuration options that determine how the control propagates changes
- * and emits events after the value changes.
- *
- * * `onlySelf`: When true, each change only affects this control, and not its parent. Default is
- * false.
- * * `emitEvent`: When true or not supplied (the default), both the `statusChanges` and
- * `valueChanges`
- * observables emit events with the latest status and value when the control is reset.
- * When false, no events are emitted.
- *
- */
- reset(formState?: any, options?: {
- onlySelf?: boolean;
- emitEvent?: boolean;
- }): void;
- /**
- * Register a listener for change events.
- *
- * @param fn The method that is called when the value changes
- */
- registerOnChange(fn: Function): void;
- /**
- * Register a listener for disabled events.
- *
- * @param fn The method that is called when the disabled status changes.
- */
- registerOnDisabledChange(fn: (isDisabled: boolean) => void): void;
- private _applyFormState;
- }
- /**
- * @description
- * * Syncs a standalone `FormControl` instance to a form control element.
- *
- * @see [Reactive Forms Guide](guide/reactive-forms)
- * @see `FormControl`
- * @see `AbstractControl`
- *
- * @usageNotes
- *
- * ### Registering a single form control
- *
- * The following examples shows how to register a standalone control and set its value.
- *
- * {@example forms/ts/simpleFormControl/simple_form_control_example.ts region='Component'}
- *
- * ### Use with ngModel
- *
- * Support for using the `ngModel` input property and `ngModelChange` event with reactive
- * form directives has been deprecated in Angular v6 and will be removed in Angular v7.
- *
- * Now deprecated:
- *
- * ```html
- * <input [formControl]="control" [(ngModel)]="value">
- * ```
- *
- * ```ts
- * this.value = 'some value';
- * ```
- *
- * This has been deprecated for a few reasons. First, developers have found this pattern
- * confusing. It seems like the actual `ngModel` directive is being used, but in fact it's
- * an input/output property named `ngModel` on the reactive form directive that simply
- * approximates (some of) its behavior. Specifically, it allows getting/setting the value
- * and intercepting value events. However, some of `ngModel`'s other features - like
- * delaying updates with`ngModelOptions` or exporting the directive - simply don't work,
- * which has understandably caused some confusion.
- *
- * In addition, this pattern mixes template-driven and reactive forms strategies, which
- * we generally don't recommend because it doesn't take advantage of the full benefits of
- * either strategy. Setting the value in the template violates the template-agnostic
- * principles behind reactive forms, whereas adding a `FormControl`/`FormGroup` layer in
- * the class removes the convenience of defining forms in the template.
- *
- * To update your code before v7, you'll want to decide whether to stick with reactive form
- * directives (and get/set values using reactive forms patterns) or switch over to
- * template-driven directives.
- *
- * After (choice 1 - use reactive forms):
- *
- * ```html
- * <input [formControl]="control">
- * ```
- *
- * ```ts
- * this.control.setValue('some value');
- * ```
- *
- * After (choice 2 - use template-driven forms):
- *
- * ```html
- * <input [(ngModel)]="value">
- * ```
- *
- * ```ts
- * this.value = 'some value';
- * ```
- *
- * By default, when you use this pattern, you will see a deprecation warning once in dev
- * mode. You can choose to silence this warning by providing a config for
- * `ReactiveFormsModule` at import time:
- *
- * ```ts
- * imports: [
- * ReactiveFormsModule.withConfig({warnOnNgModelWithFormControl: 'never'});
- * ]
- * ```
- *
- * Alternatively, you can choose to surface a separate warning for each instance of this
- * pattern with a config value of `"always"`. This may help to track down where in the code
- * the pattern is being used as the code is being updated.
- *
- * @ngModule ReactiveFormsModule
- * @publicApi
- */
- export declare class FormControlDirective extends NgControl implements OnChanges {
- private _ngModelWarningConfig;
- /**
- * @description
- * Internal reference to the view model value.
- */
- viewModel: any;
- /**
- * @description
- * Tracks the `FormControl` instance bound to the directive.
- */
- form: FormControl;
- /**
- * @description
- * Triggers a warning that this input should not be used with reactive forms.
- */
- isDisabled: boolean;
- /** @deprecated as of v6 */
- model: any;
- /** @deprecated as of v6 */
- update: EventEmitter<{}>;
- constructor(validators: Array<Validator | ValidatorFn>, asyncValidators: Array<AsyncValidator | AsyncValidatorFn>, valueAccessors: ControlValueAccessor[], _ngModelWarningConfig: string | null);
- /**
- * @description
- * A lifecycle method called when the directive's inputs change. For internal use
- * only.
- *
- * @param changes A object of key/value pairs for the set of changed inputs.
- */
- ngOnChanges(changes: SimpleChanges): void;
- /**
- * @description
- * Returns an array that represents the path from the top-level form to this control.
- * Each index is the string name of the control on that level.
- */
- readonly path: string[];
- /**
- * @description
- * Synchronous validator function composed of all the synchronous validators
- * registered with this directive.
- */
- readonly validator: ValidatorFn | null;
- /**
- * @description
- * Async validator function composed of all the async validators registered with this
- * directive.
- */
- readonly asyncValidator: AsyncValidatorFn | null;
- /**
- * @description
- * The `FormControl` bound to this directive.
- */
- readonly control: FormControl;
- /**
- * @description
- * Sets the new value for the view model and emits an `ngModelChange` event.
- *
- * @param newValue The new value for the view model.
- */
- viewToModelUpdate(newValue: any): void;
- private _isControlChanged;
- }
- /**
- * @description
- * Syncs a `FormControl` in an existing `FormGroup` to a form control
- * element by name.
- *
- * @see [Reactive Forms Guide](guide/reactive-forms)
- * @see `FormControl`
- * @see `AbstractControl`
- *
- * @usageNotes
- *
- * ### Register `FormControl` within a group
- *
- * The following example shows how to register multiple form controls within a form group
- * and set their value.
- *
- * {@example forms/ts/simpleFormGroup/simple_form_group_example.ts region='Component'}
- *
- * To see `formControlName` examples with different form control types, see:
- *
- * * Radio buttons: `RadioControlValueAccessor`
- * * Selects: `SelectControlValueAccessor`
- *
- * ### Use with ngModel
- *
- * Support for using the `ngModel` input property and `ngModelChange` event with reactive
- * form directives has been deprecated in Angular v6 and will be removed in Angular v7.
- *
- * Now deprecated:
- *
- * ```html
- * <form [formGroup]="form">
- * <input formControlName="first" [(ngModel)]="value">
- * </form>
- * ```
- *
- * ```ts
- * this.value = 'some value';
- * ```
- *
- * This has been deprecated for a few reasons. First, developers have found this pattern
- * confusing. It seems like the actual `ngModel` directive is being used, but in fact it's
- * an input/output property named `ngModel` on the reactive form directive that simply
- * approximates (some of) its behavior. Specifically, it allows getting/setting the value
- * and intercepting value events. However, some of `ngModel`'s other features - like
- * delaying updates with`ngModelOptions` or exporting the directive - simply don't work,
- * which has understandably caused some confusion.
- *
- * In addition, this pattern mixes template-driven and reactive forms strategies, which
- * we generally don't recommend because it doesn't take advantage of the full benefits of
- * either strategy. Setting the value in the template violates the template-agnostic
- * principles behind reactive forms, whereas adding a `FormControl`/`FormGroup` layer in
- * the class removes the convenience of defining forms in the template.
- *
- * To update your code before v7, you'll want to decide whether to stick with reactive form
- * directives (and get/set values using reactive forms patterns) or switch over to
- * template-driven directives.
- *
- * After (choice 1 - use reactive forms):
- *
- * ```html
- * <form [formGroup]="form">
- * <input formControlName="first">
- * </form>
- * ```
- *
- * ```ts
- * this.form.get('first').setValue('some value');
- * ```
- *
- * After (choice 2 - use template-driven forms):
- *
- * ```html
- * <input [(ngModel)]="value">
- * ```
- *
- * ```ts
- * this.value = 'some value';
- * ```
- *
- * By default, when you use this pattern, you will see a deprecation warning once in dev
- * mode. You can choose to silence this warning by providing a config for
- * `ReactiveFormsModule` at import time:
- *
- * ```ts
- * imports: [
- * ReactiveFormsModule.withConfig({warnOnNgModelWithFormControl: 'never'})
- * ]
- * ```
- *
- * Alternatively, you can choose to surface a separate warning for each instance of this
- * pattern with a config value of `"always"`. This may help to track down where in the code
- * the pattern is being used as the code is being updated.
- *
- * @ngModule ReactiveFormsModule
- * @publicApi
- */
- export declare class FormControlName extends NgControl implements OnChanges, OnDestroy {
- private _ngModelWarningConfig;
- private _added;
- /**
- * @description
- * Tracks the `FormControl` instance bound to the directive.
- */
- readonly control: FormControl;
- /**
- * @description
- * Tracks the name of the `FormControl` bound to the directive. The name corresponds
- * to a key in the parent `FormGroup` or `FormArray`.
- */
- name: string;
- /**
- * @description
- * Triggers a warning that this input should not be used with reactive forms.
- */
- isDisabled: boolean;
- /** @deprecated as of v6 */
- model: any;
- /** @deprecated as of v6 */
- update: EventEmitter<{}>;
- constructor(parent: ControlContainer, validators: Array<Validator | ValidatorFn>, asyncValidators: Array<AsyncValidator | AsyncValidatorFn>, valueAccessors: ControlValueAccessor[], _ngModelWarningConfig: string | null);
- /**
- * @description
- * A lifecycle method called when the directive's inputs change. For internal use only.
- *
- * @param changes A object of key/value pairs for the set of changed inputs.
- */
- ngOnChanges(changes: SimpleChanges): void;
- /**
- * @description
- * Lifecycle method called before the directive's instance is destroyed. For internal use only.
- */
- ngOnDestroy(): void;
- /**
- * @description
- * Sets the new value for the view model and emits an `ngModelChange` event.
- *
- * @param newValue The new value for the view model.
- */
- viewToModelUpdate(newValue: any): void;
- /**
- * @description
- * Returns an array that represents the path from the top-level form to this control.
- * Each index is the string name of the control on that level.
- */
- readonly path: string[];
- /**
- * @description
- * The top-level directive for this group if present, otherwise null.
- */
- readonly formDirective: any;
- /**
- * @description
- * Synchronous validator function composed of all the synchronous validators
- * registered with this directive.
- */
- readonly validator: ValidatorFn | null;
- /**
- * @description
- * Async validator function composed of all the async validators registered with this
- * directive.
- */
- readonly asyncValidator: AsyncValidatorFn;
- private _checkParentType;
- private _setUpControl;
- }
- /**
- * Tracks the value and validity state of a group of `FormControl` instances.
- *
- * A `FormGroup` aggregates the values of each child `FormControl` into one object,
- * with each control name as the key. It calculates its status by reducing the status values
- * of its children. For example, if one of the controls in a group is invalid, the entire
- * group becomes invalid.
- *
- * `FormGroup` is one of the three fundamental building blocks used to define forms in Angular,
- * along with `FormControl` and `FormArray`.
- *
- * When instantiating a `FormGroup`, pass in a collection of child controls as the first
- * argument. The key for each child registers the name for the control.
- *
- * @usageNotes
- *
- * ### Create a form group with 2 controls
- *
- * ```
- * const form = new FormGroup({
- * first: new FormControl('Nancy', Validators.minLength(2)),
- * last: new FormControl('Drew'),
- * });
- *
- * console.log(form.value); // {first: 'Nancy', last; 'Drew'}
- * console.log(form.status); // 'VALID'
- * ```
- *
- * ### Create a form group with a group-level validator
- *
- * You include group-level validators as the second arg, or group-level async
- * validators as the third arg. These come in handy when you want to perform validation
- * that considers the value of more than one child control.
- *
- * ```
- * const form = new FormGroup({
- * password: new FormControl('', Validators.minLength(2)),
- * passwordConfirm: new FormControl('', Validators.minLength(2)),
- * }, passwordMatchValidator);
- *
- *
- * function passwordMatchValidator(g: FormGroup) {
- * return g.get('password').value === g.get('passwordConfirm').value
- * ? null : {'mismatch': true};
- * }
- * ```
- *
- * Like `FormControl` instances, you choose to pass in
- * validators and async validators as part of an options object.
- *
- * ```
- * const form = new FormGroup({
- * password: new FormControl('')
- * passwordConfirm: new FormControl('')
- * }, { validators: passwordMatchValidator, asyncValidators: otherValidator });
- * ```
- *
- * ### Set the updateOn property for all controls in a form group
- *
- * The options object is used to set a default value for each child
- * control's `updateOn` property. If you set `updateOn` to `'blur'` at the
- * group level, all child controls default to 'blur', unless the child
- * has explicitly specified a different `updateOn` value.
- *
- * ```ts
- * const c = new FormGroup({
- * one: new FormControl()
- * }, { updateOn: 'blur' });
- * ```
- *
- * @publicApi
- */
- export declare class FormGroup extends AbstractControl {
- controls: {
- [key: string]: AbstractControl;
- };
- /**
- * Creates a new `FormGroup` instance.
- *
- * @param controls A collection of child controls. The key for each child is the name
- * under which it is registered.
- *
- * @param validatorOrOpts A synchronous validator function, or an array of
- * such functions, or an `AbstractControlOptions` object that contains validation functions
- * and a validation trigger.
- *
- * @param asyncValidator A single async validator or array of async validator functions
- *
- */
- constructor(controls: {
- [key: string]: AbstractControl;
- }, validatorOrOpts?: ValidatorFn | ValidatorFn[] | AbstractControlOptions | null, asyncValidator?: AsyncValidatorFn | AsyncValidatorFn[] | null);
- /**
- * Registers a control with the group's list of controls.
- *
- * This method does not update the value or validity of the control.
- * Use {@link FormGroup#addControl addControl} instead.
- *
- * @param name The control name to register in the collection
- * @param control Provides the control for the given name
- */
- registerControl(name: string, control: AbstractControl): AbstractControl;
- /**
- * Add a control to this group.
- *
- * This method also updates the value and validity of the control.
- *
- * @param name The control name to add to the collection
- * @param control Provides the control for the given name
- */
- addControl(name: string, control: AbstractControl): void;
- /**
- * Remove a control from this group.
- *
- * @param name The control name to remove from the collection
- */
- removeControl(name: string): void;
- /**
- * Replace an existing control.
- *
- * @param name The control name to replace in the collection
- * @param control Provides the control for the given name
- */
- setControl(name: string, control: AbstractControl): void;
- /**
- * Check whether there is an enabled control with the given name in the group.
- *
- * Reports false for disabled controls. If you'd like to check for existence in the group
- * only, use {@link AbstractControl#get get} instead.
- *
- * @param name The control name to check for existence in the collection
- *
- * @returns false for disabled controls, true otherwise.
- */
- contains(controlName: string): boolean;
- /**
- * Sets the value of the `FormGroup`. It accepts an object that matches
- * the structure of the group, with control names as keys.
- *
- * @usageNotes
- * ### Set the complete value for the form group
- *
- * ```
- * const form = new FormGroup({
- * first: new FormControl(),
- * last: new FormControl()
- * });
- *
- * console.log(form.value); // {first: null, last: null}
- *
- * form.setValue({first: 'Nancy', last: 'Drew'});
- * console.log(form.value); // {first: 'Nancy', last: 'Drew'}
- * ```
- *
- * @throws When strict checks fail, such as setting the value of a control
- * that doesn't exist or if you excluding the value of a control.
- *
- * @param value The new value for the control that matches the structure of the group.
- * @param options Configuration options that determine how the control propagates changes
- * and emits events after the value changes.
- * The configuration options are passed to the {@link AbstractControl#updateValueAndValidity
- * updateValueAndValidity} method.
- *
- * * `onlySelf`: When true, each change only affects this control, and not its parent. Default is
- * false.
- * * `emitEvent`: When true or not supplied (the default), both the `statusChanges` and
- * `valueChanges`
- * observables emit events with the latest status and value when the control value is updated.
- * When false, no events are emitted.
- */
- setValue(value: {
- [key: string]: any;
- }, options?: {
- onlySelf?: boolean;
- emitEvent?: boolean;
- }): void;
- /**
- * Patches the value of the `FormGroup`. It accepts an object with control
- * names as keys, and does its best to match the values to the correct controls
- * in the group.
- *
- * It accepts both super-sets and sub-sets of the group without throwing an error.
- *
- * @usageNotes
- * ### Patch the value for a form group
- *
- * ```
- * const form = new FormGroup({
- * first: new FormControl(),
- * last: new FormControl()
- * });
- * console.log(form.value); // {first: null, last: null}
- *
- * form.patchValue({first: 'Nancy'});
- * console.log(form.value); // {first: 'Nancy', last: null}
- * ```
- *
- * @param value The object that matches the structure of the group.
- * @param options Configuration options that determine how the control propagates changes and
- * emits events after the value is patched.
- * * `onlySelf`: When true, each change only affects this control and not its parent. Default is
- * true.
- * * `emitEvent`: When true or not supplied (the default), both the `statusChanges` and
- * `valueChanges`
- * observables emit events with the latest status and value when the control value is updated.
- * When false, no events are emitted.
- * The configuration options are passed to the {@link AbstractControl#updateValueAndValidity
- * updateValueAndValidity} method.
- */
- patchValue(value: {
- [key: string]: any;
- }, options?: {
- onlySelf?: boolean;
- emitEvent?: boolean;
- }): void;
- /**
- * Resets the `FormGroup`, marks all descendants are marked `pristine` and `untouched`, and
- * the value of all descendants to null.
- *
- * You reset to a specific form state by passing in a map of states
- * that matches the structure of your form, with control names as keys. The state
- * is a standalone value or a form state object with both a value and a disabled
- * status.
- *
- * @param formState Resets the control with an initial value,
- * or an object that defines the initial value and disabled state.
- *
- * @param options Configuration options that determine how the control propagates changes
- * and emits events when the group is reset.
- * * `onlySelf`: When true, each change only affects this control, and not its parent. Default is
- * false.
- * * `emitEvent`: When true or not supplied (the default), both the `statusChanges` and
- * `valueChanges`
- * observables emit events with the latest status and value when the control is reset.
- * When false, no events are emitted.
- * The configuration options are passed to the {@link AbstractControl#updateValueAndValidity
- * updateValueAndValidity} method.
- *
- * @usageNotes
- *
- * ### Reset the form group values
- *
- * ```ts
- * const form = new FormGroup({
- * first: new FormControl('first name'),
- * last: new FormControl('last name')
- * });
- *
- * console.log(form.value); // {first: 'first name', last: 'last name'}
- *
- * form.reset({ first: 'name', last: 'last name' });
- *
- * console.log(form.value); // {first: 'name', last: 'last name'}
- * ```
- *
- * ### Reset the form group values and disabled status
- *
- * ```
- * const form = new FormGroup({
- * first: new FormControl('first name'),
- * last: new FormControl('last name')
- * });
- *
- * form.reset({
- * first: {value: 'name', disabled: true},
- * last: 'last'
- * });
- *
- * console.log(this.form.value); // {first: 'name', last: 'last name'}
- * console.log(this.form.get('first').status); // 'DISABLED'
- * ```
- */
- reset(value?: any, options?: {
- onlySelf?: boolean;
- emitEvent?: boolean;
- }): void;
- /**
- * The aggregate value of the `FormGroup`, including any disabled controls.
- *
- * Retrieves all values regardless of disabled status.
- * The `value` property is the best way to get the value of the group, because
- * it excludes disabled controls in the `FormGroup`.
- */
- getRawValue(): any;
- }
- /**
- * @description
- *
- * Binds an existing `FormGroup` to a DOM element.
- *
- * This directive accepts an existing `FormGroup` instance. It will then use this
- * `FormGroup` instance to match any child `FormControl`, `FormGroup`,
- * and `FormArray` instances to child `FormControlName`, `FormGroupName`,
- * and `FormArrayName` directives.
- *
- * @see [Reactive Forms Guide](guide/reactive-forms)
- * @see `AbstractControl`
- *
- * ### Register Form Group
- *
- * The following example registers a `FormGroup` with first name and last name controls,
- * and listens for the *ngSubmit* event when the button is clicked.
- *
- * {@example forms/ts/simpleFormGroup/simple_form_group_example.ts region='Component'}
- *
- * @ngModule ReactiveFormsModule
- * @publicApi
- */
- export declare class FormGroupDirective extends ControlContainer implements Form, OnChanges {
- private _validators;
- private _asyncValidators;
- /**
- * @description
- * Reports whether the form submission has been triggered.
- */
- readonly submitted: boolean;
- private _oldForm;
- /**
- * @description
- * Tracks the list of added `FormControlName` instances
- */
- directives: FormControlName[];
- /**
- * @description
- * Tracks the `FormGroup` bound to this directive.
- */
- form: FormGroup;
- /**
- * @description
- * Emits an event when the form submission has been triggered.
- */
- ngSubmit: EventEmitter<{}>;
- constructor(_validators: any[], _asyncValidators: any[]);
- /**
- * @description
- * A lifecycle method called when the directive's inputs change. For internal use only.
- *
- * @param changes A object of key/value pairs for the set of changed inputs.
- */
- ngOnChanges(changes: SimpleChanges): void;
- /**
- * @description
- * Returns this directive's instance.
- */
- readonly formDirective: Form;
- /**
- * @description
- * Returns the `FormGroup` bound to this directive.
- */
- readonly control: FormGroup;
- /**
- * @description
- * Returns an array representing the path to this group. Because this directive
- * always lives at the top level of a form, it always an empty array.
- */
- readonly path: string[];
- /**
- * @description
- * Method that sets up the control directive in this group, re-calculates its value
- * and validity, and adds the instance to the internal list of directives.
- *
- * @param dir The `FormControlName` directive instance.
- */
- addControl(dir: FormControlName): FormControl;
- /**
- * @description
- * Retrieves the `FormControl` instance from the provided `FormControlName` directive
- *
- * @param dir The `FormControlName` directive instance.
- */
- getControl(dir: FormControlName): FormControl;
- /**
- * @description
- * Removes the `FormControlName` instance from the internal list of directives
- *
- * @param dir The `FormControlName` directive instance.
- */
- removeControl(dir: FormControlName): void;
- /**
- * Adds a new `FormGroupName` directive instance to the form.
- *
- * @param dir The `FormGroupName` directive instance.
- */
- addFormGroup(dir: FormGroupName): void;
- /**
- * No-op method to remove the form group.
- *
- * @param dir The `FormGroupName` directive instance.
- */
- removeFormGroup(dir: FormGroupName): void;
- /**
- * @description
- * Retrieves the `FormGroup` for a provided `FormGroupName` directive instance
- *
- * @param dir The `FormGroupName` directive instance.
- */
- getFormGroup(dir: FormGroupName): FormGroup;
- /**
- * Adds a new `FormArrayName` directive instance to the form.
- *
- * @param dir The `FormArrayName` directive instance.
- */
- addFormArray(dir: FormArrayName): void;
- /**
- * No-op method to remove the form array.
- *
- * @param dir The `FormArrayName` directive instance.
- */
- removeFormArray(dir: FormArrayName): void;
- /**
- * @description
- * Retrieves the `FormArray` for a provided `FormArrayName` directive instance.
- *
- * @param dir The `FormArrayName` directive instance.
- */
- getFormArray(dir: FormArrayName): FormArray;
- /**
- * Sets the new value for the provided `FormControlName` directive.
- *
- * @param dir The `FormControlName` directive instance.
- * @param value The new value for the directive's control.
- */
- updateModel(dir: FormControlName, value: any): void;
- /**
- * @description
- * Method called with the "submit" event is triggered on the form.
- * Triggers the `ngSubmit` emitter to emit the "submit" event as its payload.
- *
- * @param $event The "submit" event object
- */
- onSubmit($event: Event): boolean;
- /**
- * @description
- * Method called when the "reset" event is triggered on the form.
- */
- onReset(): void;
- /**
- * @description
- * Resets the form to an initial value and resets its submitted status.
- *
- * @param value The new value for the form.
- */
- resetForm(value?: any): void;
- private _updateRegistrations;
- private _updateValidators;
- private _checkFormPresent;
- }
- /**
- * @description
- *
- * Syncs a nested `FormGroup` to a DOM element.
- *
- * This directive can only be used with a parent `FormGroupDirective`.
- *
- * It accepts the string name of the nested `FormGroup` to link, and
- * looks for a `FormGroup` registered with that name in the parent
- * `FormGroup` instance you passed into `FormGroupDirective`.
- *
- * Use nested form groups to validate a sub-group of a
- * form separately from the rest or to group the values of certain
- * controls into their own nested object.
- *
- * @see [Reactive Forms Guide](guide/reactive-forms)
- *
- * @usageNotes
- *
- * ### Access the group by name
- *
- * The following example uses the {@link AbstractControl#get get} method to access the
- * associated `FormGroup`
- *
- * ```ts
- * this.form.get('name');
- * ```
- *
- * ### Access individual controls in the group
- *
- * The following example uses the {@link AbstractControl#get get} method to access
- * individual controls within the group using dot syntax.
- *
- * ```ts
- * this.form.get('name.first');
- * ```
- *
- * ### Register a nested `FormGroup`.
- *
- * The following example registers a nested *name* `FormGroup` within an existing `FormGroup`,
- * and provides methods to retrieve the nested `FormGroup` and individual controls.
- *
- * {@example forms/ts/nestedFormGroup/nested_form_group_example.ts region='Component'}
- *
- * @ngModule ReactiveFormsModule
- * @publicApi
- */
- export declare class FormGroupName extends AbstractFormGroupDirective implements OnInit, OnDestroy {
- /**
- * @description
- * Tracks the name of the `FormGroup` bound to the directive. The name corresponds
- * to a key in the parent `FormGroup` or `FormArray`.
- */
- name: string;
- constructor(parent: ControlContainer, validators: any[], asyncValidators: any[]);
- }
- declare type FormHooks = 'change' | 'blur' | 'submit';
- /**
- * Exports the required providers and directives for template-driven forms,
- * making them available for import by NgModules that import this module.
- *
- * @see [Forms Guide](/guide/forms)
- *
- * @publicApi
- */
- export declare class FormsModule {
- /**
- * @description
- * Provides options for configuring the template-driven forms module.
- *
- * @param opts An object of configuration options
- * * `warnOnDeprecatedNgFormSelector` Configures when to emit a warning when the deprecated
- * `ngForm` selector is used.
- */
- static withConfig(opts: {
- /** @deprecated as of v6 */ warnOnDeprecatedNgFormSelector?: 'never' | 'once' | 'always';
- }): ModuleWithProviders<FormsModule>;
- }
- /**
- * A directive that adds max length validation to controls marked with the
- * `maxlength` attribute. The directive is provided with the `NG_VALIDATORS` multi-provider list.
- *
- * @see [Form Validation](guide/form-validation)
- *
- * @usageNotes
- *
- * ### Adding a maximum length validator
- *
- * The following example shows how to add a maximum length validator to an input attached to an
- * ngModel binding.
- *
- * ```html
- * <input name="firstName" ngModel maxlength="25">
- * ```
- *
- * @ngModule ReactiveFormsModule
- * @ngModule FormsModule
- * @publicApi
- */
- export declare class MaxLengthValidator implements Validator, OnChanges {
- private _validator;
- private _onChange;
- /**
- * @description
- * Tracks changes to the the maximum length bound to this directive.
- */
- maxlength: string;
- /**
- * @description
- * A lifecycle method called when the directive's inputs change. For internal use
- * only.
- *
- * @param changes A object of key/value pairs for the set of changed inputs.
- */
- ngOnChanges(changes: SimpleChanges): void;
- /**
- * @description
- * Method that validates whether the value exceeds
- * the maximum length requirement.
- */
- validate(control: AbstractControl): ValidationErrors | null;
- /**
- * @description
- * Registers a callback function to call when the validator inputs change.
- *
- * @param fn The callback function
- */
- registerOnValidatorChange(fn: () => void): void;
- private _createValidator;
- }
- /**
- * A directive that adds minimum length validation to controls marked with the
- * `minlength` attribute. The directive is provided with the `NG_VALIDATORS` mult-provider list.
- *
- * @see [Form Validation](guide/form-validation)
- *
- * @usageNotes
- *
- * ### Adding a minimum length validator
- *
- * The following example shows how to add a minimum length validator to an input attached to an
- * ngModel binding.
- *
- * ```html
- * <input name="firstName" ngModel minlength="4">
- * ```
- *
- * @ngModule ReactiveFormsModule
- * @ngModule FormsModule
- * @publicApi
- */
- export declare class MinLengthValidator implements Validator, OnChanges {
- private _validator;
- private _onChange;
- /**
- * @description
- * Tracks changes to the the minimum length bound to this directive.
- */
- minlength: string;
- /**
- * @description
- * A lifecycle method called when the directive's inputs change. For internal use
- * only.
- *
- * @param changes A object of key/value pairs for the set of changed inputs.
- */
- ngOnChanges(changes: SimpleChanges): void;
- /**
- * @description
- * Method that validates whether the value meets a minimum length
- * requirement. Returns the validation result if enabled, otherwise null.
- */
- validate(control: AbstractControl): ValidationErrors | null;
- /**
- * @description
- * Registers a callback function to call when the validator inputs change.
- *
- * @param fn The callback function
- */
- registerOnValidatorChange(fn: () => void): void;
- private _createValidator;
- }
- /**
- * @description
- * An `InjectionToken` for registering additional asynchronous validators used with `AbstractControl`s.
- *
- * @see `NG_VALIDATORS`
- *
- * @publicApi
- */
- export declare const NG_ASYNC_VALIDATORS: InjectionToken<(Function | Validator)[]>;
- /**
- * @description
- * An `InjectionToken` for registering additional synchronous validators used with `AbstractControl`s.
- *
- * @see `NG_ASYNC_VALIDATORS`
- *
- * @usageNotes
- *
- * ### Providing a custom validator
- *
- * The following example registers a custom validator directive. Adding the validator to the
- * existing collection of validators requires the `multi: true` option.
- *
- * ```typescript
- * @Directive({
- * selector: '[customValidator]',
- * providers: [{provide: NG_VALIDATORS, useExisting: CustomValidatorDirective, multi: true}]
- * })
- * class CustomValidatorDirective implements Validator {
- * validate(control: AbstractControl): ValidationErrors | null {
- * return { 'custom': true };
- * }
- * }
- * ```
- *
- * @publicApi
- */
- export declare const NG_VALIDATORS: InjectionToken<(Function | Validator)[]>;
- /**
- * Used to provide a `ControlValueAccessor` for form controls.
- *
- * See `DefaultValueAccessor` for how to implement one.
- *
- * @publicApi
- */
- export declare const NG_VALUE_ACCESSOR: InjectionToken<ControlValueAccessor>;
- /**
- * @description
- * A base class that all control `FormControl`-based directives extend. It binds a `FormControl`
- * object to a DOM element.
- *
- * @publicApi
- */
- export declare abstract class NgControl extends AbstractControlDirective {
- /**
- * @description
- * The name for the control
- */
- name: string | null;
- /**
- * @description
- * The value accessor for the control
- */
- valueAccessor: ControlValueAccessor | null;
- /**
- * @description
- * The registered synchronous validator function for the control
- *
- * @throws An exception that this method is not implemented
- */
- readonly validator: ValidatorFn | null;
- /**
- * @description
- * The registered async validator function for the control
- *
- * @throws An exception that this method is not implemented
- */
- readonly asyncValidator: AsyncValidatorFn | null;
- /**
- * @description
- * The callback method to update the model from the view when requested
- *
- * @param newValue The new value for the view
- */
- abstract viewToModelUpdate(newValue: any): void;
- }
- /**
- * @description
- * Directive automatically applied to Angular form controls that sets CSS classes
- * based on control status.
- *
- * @usageNotes
- *
- * ### CSS classes applied
- *
- * The following classes are applied as the properties become true:
- *
- * * ng-valid
- * * ng-invalid
- * * ng-pending
- * * ng-pristine
- * * ng-dirty
- * * ng-untouched
- * * ng-touched
- *
- * @ngModule ReactiveFormsModule
- * @ngModule FormsModule
- * @publicApi
- */
- export declare class NgControlStatus extends ɵangular_packages_forms_forms_g {
- constructor(cd: NgControl);
- }
- /**
- * @description
- * Directive automatically applied to Angular form groups that sets CSS classes
- * based on control status (valid/invalid/dirty/etc).
- *
- * @see `NgControlStatus`
- *
- * @ngModule ReactiveFormsModule
- * @ngModule FormsModule
- * @publicApi
- */
- export declare class NgControlStatusGroup extends ɵangular_packages_forms_forms_g {
- constructor(cd: ControlContainer);
- }
- /**
- * @description
- * Creates a top-level `FormGroup` instance and binds it to a form
- * to track aggregate form value and validation status.
- *
- * As soon as you import the `FormsModule`, this directive becomes active by default on
- * all `<form>` tags. You don't need to add a special selector.
- *
- * You optionally export the directive into a local template variable using `ngForm` as the key
- * (ex: `#myForm="ngForm"`). This is optional, but useful. Many properties from the underlying
- * `FormGroup` instance are duplicated on the directive itself, so a reference to it
- * gives you access to the aggregate value and validity status of the form, as well as
- * user interaction properties like `dirty` and `touched`.
- *
- * To register child controls with the form, use `NgModel` with a `name`
- * attribute. You may use `NgModelGroup` to create sub-groups within the form.
- *
- * If necessary, listen to the directive's `ngSubmit` event to be notified when the user has
- * triggered a form submission. The `ngSubmit` event emits the original form
- * submission event.
- *
- * In template driven forms, all `<form>` tags are automatically tagged as `NgForm`.
- * To import the `FormsModule` but skip its usage in some forms,
- * for example, to use native HTML5 validation, add the `ngNoForm` and the `<form>`
- * tags won't create an `NgForm` directive. In reactive forms, using `ngNoForm` is
- * unnecessary because the `<form>` tags are inert. In that case, you would
- * refrain from using the `formGroup` directive.
- *
- * @usageNotes
- *
- * ### Migrating from deprecated ngForm selector
- *
- * Support for using `ngForm` element selector has been deprecated in Angular v6 and will be removed
- * in Angular v9.
- *
- * This has been deprecated to keep selectors consistent with other core Angular selectors,
- * as element selectors are typically written in kebab-case.
- *
- * Now deprecated:
- * ```html
- * <ngForm #myForm="ngForm">
- * ```
- *
- * After:
- * ```html
- * <ng-form #myForm="ngForm">
- * ```
- *
- * ### Listening for form submission
- *
- * The following example shows how to capture the form values from the "ngSubmit" event.
- *
- * {@example forms/ts/simpleForm/simple_form_example.ts region='Component'}
- *
- * ### Setting the update options
- *
- * The following example shows you how to change the "updateOn" option from its default using
- * ngFormOptions.
- *
- * ```html
- * <form [ngFormOptions]="{updateOn: 'blur'}">
- * <input name="one" ngModel> <!-- this ngModel will update on blur -->
- * </form>
- * ```
- *
- * @ngModule FormsModule
- * @publicApi
- */
- export declare class NgForm extends ControlContainer implements Form, AfterViewInit {
- /**
- * @description
- * Returns whether the form submission has been triggered.
- */
- readonly submitted: boolean;
- private _directives;
- /**
- * @description
- * The `FormGroup` instance created for this form.
- */
- form: FormGroup;
- /**
- * @description
- * Event emitter for the "ngSubmit" event
- */
- ngSubmit: EventEmitter<{}>;
- /**
- * @description
- * Tracks options for the `NgForm` instance.
- *
- * **updateOn**: Sets the default `updateOn` value for all child `NgModels` below it
- * unless explicitly set by a child `NgModel` using `ngModelOptions`). Defaults to 'change'.
- * Possible values: `'change'` | `'blur'` | `'submit'`.
- *
- */
- options: {
- updateOn?: FormHooks;
- };
- constructor(validators: any[], asyncValidators: any[]);
- /**
- * @description
- * Lifecycle method called after the view is initialized. For internal use only.
- */
- ngAfterViewInit(): void;
- /**
- * @description
- * The directive instance.
- */
- readonly formDirective: Form;
- /**
- * @description
- * The internal `FormGroup` instance.
- */
- readonly control: FormGroup;
- /**
- * @description
- * Returns an array representing the path to this group. Because this directive
- * always lives at the top level of a form, it is always an empty array.
- */
- readonly path: string[];
- /**
- * @description
- * Returns a map of the controls in this group.
- */
- readonly controls: {
- [key: string]: AbstractControl;
- };
- /**
- * @description
- * Method that sets up the control directive in this group, re-calculates its value
- * and validity, and adds the instance to the internal list of directives.
- *
- * @param dir The `NgModel` directive instance.
- */
- addControl(dir: NgModel): void;
- /**
- * @description
- * Retrieves the `FormControl` instance from the provided `NgModel` directive.
- *
- * @param dir The `NgModel` directive instance.
- */
- getControl(dir: NgModel): FormControl;
- /**
- * @description
- * Removes the `NgModel` instance from the internal list of directives
- *
- * @param dir The `NgModel` directive instance.
- */
- removeControl(dir: NgModel): void;
- /**
- * @description
- * Adds a new `NgModelGroup` directive instance to the form.
- *
- * @param dir The `NgModelGroup` directive instance.
- */
- addFormGroup(dir: NgModelGroup): void;
- /**
- * @description
- * Removes the `NgModelGroup` directive instance from the form.
- *
- * @param dir The `NgModelGroup` directive instance.
- */
- removeFormGroup(dir: NgModelGroup): void;
- /**
- * @description
- * Retrieves the `FormGroup` for a provided `NgModelGroup` directive instance
- *
- * @param dir The `NgModelGroup` directive instance.
- */
- getFormGroup(dir: NgModelGroup): FormGroup;
- /**
- * Sets the new value for the provided `NgControl` directive.
- *
- * @param dir The `NgControl` directive instance.
- * @param value The new value for the directive's control.
- */
- updateModel(dir: NgControl, value: any): void;
- /**
- * @description
- * Sets the value for this `FormGroup`.
- *
- * @param value The new value
- */
- setValue(value: {
- [key: string]: any;
- }): void;
- /**
- * @description
- * Method called when the "submit" event is triggered on the form.
- * Triggers the `ngSubmit` emitter to emit the "submit" event as its payload.
- *
- * @param $event The "submit" event object
- */
- onSubmit($event: Event): boolean;
- /**
- * @description
- * Method called when the "reset" event is triggered on the form.
- */
- onReset(): void;
- /**
- * @description
- * Resets the form to an initial value and resets its submitted status.
- *
- * @param value The new value for the form.
- */
- resetForm(value?: any): void;
- private _setUpdateStrategy;
- }
- /**
- * This directive is solely used to display warnings when the deprecated `ngForm` selector is used.
- *
- * @deprecated in Angular v6 and will be removed in Angular v9.
- * @ngModule FormsModule
- * @publicApi
- */
- export declare class NgFormSelectorWarning {
- constructor(ngFormWarning: string | null);
- }
- /**
- * @description
- * Creates a `FormControl` instance from a domain model and binds it
- * to a form control element.
- *
- * The `FormControl` instance tracks the value, user interaction, and
- * validation status of the control and keeps the view synced with the model. If used
- * within a parent form, the directive also registers itself with the form as a child
- * control.
- *
- * This directive is used by itself or as part of a larger form. Use the
- * `ngModel` selector to activate it.
- *
- * It accepts a domain model as an optional `Input`. If you have a one-way binding
- * to `ngModel` with `[]` syntax, changing the value of the domain model in the component
- * class sets the value in the view. If you have a two-way binding with `[()]` syntax
- * (also known as 'banana-box syntax'), the value in the UI always syncs back to
- * the domain model in your class.
- *
- * To inspect the properties of the associated `FormControl` (like validity state),
- * export the directive into a local template variable using `ngModel` as the key (ex: `#myVar="ngModel"`).
- * You then access the control using the directive's `control` property,
- * but most properties used (like `valid` and `dirty`) fall through to the control anyway for direct access.
- * See a full list of properties directly available in `AbstractControlDirective`.
- *
- * @see `RadioControlValueAccessor`
- * @see `SelectControlValueAccessor`
- *
- * @usageNotes
- *
- * ### Using ngModel on a standalone control
- *
- * The following examples show a simple standalone control using `ngModel`:
- *
- * {@example forms/ts/simpleNgModel/simple_ng_model_example.ts region='Component'}
- *
- * When using the `ngModel` within `<form>` tags, you'll also need to supply a `name` attribute
- * so that the control can be registered with the parent form under that name.
- *
- * In the context of a parent form, it's often unnecessary to include one-way or two-way binding,
- * as the parent form syncs the value for you. You access its properties by exporting it into a
- * local template variable using `ngForm` such as (`#f="ngForm"`). Use the variable where
- * needed on form submission.
- *
- * If you do need to populate initial values into your form, using a one-way binding for
- * `ngModel` tends to be sufficient as long as you use the exported form's value rather
- * than the domain model's value on submit.
- *
- * ### Using ngModel within a form
- *
- * The following example shows controls using `ngModel` within a form:
- *
- * {@example forms/ts/simpleForm/simple_form_example.ts region='Component'}
- *
- * ### Using a standalone ngModel within a group
- *
- * The following example shows you how to use a standalone ngModel control
- * within a form. This controls the display of the form, but doesn't contain form data.
- *
- * ```html
- * <form>
- * <input name="login" ngModel placeholder="Login">
- * <input type="checkbox" ngModel [ngModelOptions]="{standalone: true}"> Show more options?
- * </form>
- * <!-- form value: {login: ''} -->
- * ```
- *
- * ### Setting the ngModel name attribute through options
- *
- * The following example shows you an alternate way to set the name attribute. The name attribute is used
- * within a custom form component, and the name `@Input` property serves a different purpose.
- *
- * ```html
- * <form>
- * <my-person-control name="Nancy" ngModel [ngModelOptions]="{name: 'user'}">
- * </my-person-control>
- * </form>
- * <!-- form value: {user: ''} -->
- * ```
- *
- * @ngModule FormsModule
- * @publicApi
- */
- export declare class NgModel extends NgControl implements OnChanges, OnDestroy {
- readonly control: FormControl;
- /**
- * @description
- * Internal reference to the view model value.
- */
- viewModel: any;
- /**
- * @description
- * Tracks the name bound to the directive. The parent form
- * uses this name as a key to retrieve this control's value.
- */
- name: string;
- /**
- * @description
- * Tracks whether the control is disabled.
- */
- isDisabled: boolean;
- /**
- * @description
- * Tracks the value bound to this directive.
- */
- model: any;
- /**
- * @description
- * Tracks the configuration options for this `ngModel` instance.
- *
- * **name**: An alternative to setting the name attribute on the form control element. See
- * the [example](api/forms/NgModel#using-ngmodel-on-a-standalone-control) for using `NgModel`
- * as a standalone control.
- *
- * **standalone**: When set to true, the `ngModel` will not register itself with its parent form,
- * and acts as if it's not in the form. Defaults to false.
- *
- * **updateOn**: Defines the event upon which the form control value and validity update.
- * Defaults to 'change'. Possible values: `'change'` | `'blur'` | `'submit'`.
- *
- */
- options: {
- name?: string;
- standalone?: boolean;
- updateOn?: FormHooks;
- };
- /**
- * @description
- * Event emitter for producing the `ngModelChange` event after
- * the view model updates.
- */
- update: EventEmitter<{}>;
- constructor(parent: ControlContainer, validators: Array<Validator | ValidatorFn>, asyncValidators: Array<AsyncValidator | AsyncValidatorFn>, valueAccessors: ControlValueAccessor[]);
- /**
- * @description
- * A lifecycle method called when the directive's inputs change. For internal use
- * only.
- *
- * @param changes A object of key/value pairs for the set of changed inputs.
- */
- ngOnChanges(changes: SimpleChanges): void;
- /**
- * @description
- * Lifecycle method called before the directive's instance is destroyed. For internal
- * use only.
- */
- ngOnDestroy(): void;
- /**
- * @description
- * Returns an array that represents the path from the top-level form to this control.
- * Each index is the string name of the control on that level.
- */
- readonly path: string[];
- /**
- * @description
- * The top-level directive for this control if present, otherwise null.
- */
- readonly formDirective: any;
- /**
- * @description
- * Synchronous validator function composed of all the synchronous validators
- * registered with this directive.
- */
- readonly validator: ValidatorFn | null;
- /**
- * @description
- * Async validator function composed of all the async validators registered with this
- * directive.
- */
- readonly asyncValidator: AsyncValidatorFn | null;
- /**
- * @description
- * Sets the new value for the view model and emits an `ngModelChange` event.
- *
- * @param newValue The new value emitted by `ngModelChange`.
- */
- viewToModelUpdate(newValue: any): void;
- private _setUpControl;
- private _setUpdateStrategy;
- private _isStandalone;
- private _setUpStandalone;
- private _checkForErrors;
- private _checkParentType;
- private _checkName;
- private _updateValue;
- private _updateDisabled;
- }
- /**
- * @description
- * Creates and binds a `FormGroup` instance to a DOM element.
- *
- * This directive can only be used as a child of `NgForm` (within `<form>` tags).
- *
- * Use this directive to validate a sub-group of your form separately from the
- * rest of your form, or if some values in your domain model make more sense
- * to consume together in a nested object.
- *
- * Provide a name for the sub-group and it will become the key
- * for the sub-group in the form's full value. If you need direct access, export the directive into
- * a local template variable using `ngModelGroup` (ex: `#myGroup="ngModelGroup"`).
- *
- * @usageNotes
- *
- * ### Consuming controls in a grouping
- *
- * The following example shows you how to combine controls together in a sub-group
- * of the form.
- *
- * {@example forms/ts/ngModelGroup/ng_model_group_example.ts region='Component'}
- *
- * @ngModule FormsModule
- * @publicApi
- */
- export declare class NgModelGroup extends AbstractFormGroupDirective implements OnInit, OnDestroy {
- /**
- * @description
- * Tracks the name of the `NgModelGroup` bound to the directive. The name corresponds
- * to a key in the parent `NgForm`.
- */
- name: string;
- constructor(parent: ControlContainer, validators: any[], asyncValidators: any[]);
- }
- /**
- * @description
- * Marks `<option>` as dynamic, so Angular can be notified when options change.
- *
- * @see `SelectControlValueAccessor`
- *
- * @ngModule ReactiveFormsModule
- * @ngModule FormsModule
- * @publicApi
- */
- export declare class NgSelectOption implements OnDestroy {
- private _element;
- private _renderer;
- private _select;
- /**
- * @description
- * ID of the option element
- */
- id: string;
- constructor(_element: ElementRef, _renderer: Renderer2, _select: SelectControlValueAccessor);
- /**
- * @description
- * Tracks the value bound to the option element. Unlike the value binding,
- * ngValue supports binding to objects.
- */
- ngValue: any;
- /**
- * @description
- * Tracks simple string values bound to the option element.
- * For objects, use the `ngValue` input binding.
- */
- value: any;
- /**
- * @description
- * Lifecycle method called before the directive's instance is destroyed. For internal use only.
- */
- ngOnDestroy(): void;
- }
- /**
- * @description
- * The `ControlValueAccessor` for writing a number value and listening to number input changes.
- * The value accessor is used by the `FormControlDirective`, `FormControlName`, and `NgModel`
- * directives.
- *
- * @usageNotes
- *
- * ### Using a number input with a reactive form.
- *
- * The following example shows how to use a number input with a reactive form.
- *
- * ```ts
- * const totalCountControl = new FormControl();
- * ```
- *
- * ```
- * <input type="number" [formControl]="totalCountControl">
- * ```
- *
- * @ngModule ReactiveFormsModule
- * @ngModule FormsModule
- * @publicApi
- */
- export declare class NumberValueAccessor implements ControlValueAccessor {
- private _renderer;
- private _elementRef;
- /**
- * @description
- * The registered callback function called when a change or input event occurs on the input
- * element.
- */
- onChange: (_: any) => void;
- /**
- * @description
- * The registered callback function called when a blur event occurs on the input element.
- */
- onTouched: () => void;
- constructor(_renderer: Renderer2, _elementRef: ElementRef);
- /**
- * Sets the "value" property on the input element.
- *
- * @param value The checked value
- */
- writeValue(value: number): void;
- /**
- * @description
- * Registers a function called when the control value changes.
- *
- * @param fn The callback function
- */
- registerOnChange(fn: (_: number | null) => void): void;
- /**
- * @description
- * Registers a function called when the control is touched.
- *
- * @param fn The callback function
- */
- registerOnTouched(fn: () => void): void;
- /**
- * Sets the "disabled" property on the input element.
- *
- * @param isDisabled The disabled value
- */
- setDisabledState(isDisabled: boolean): void;
- }
- /**
- * @description
- * A directive that adds regex pattern validation to controls marked with the
- * `pattern` attribute. The regex must match the entire control value.
- * The directive is provided with the `NG_VALIDATORS` multi-provider list.
- *
- * @see [Form Validation](guide/form-validation)
- *
- * @usageNotes
- *
- * ### Adding a pattern validator
- *
- * The following example shows how to add a pattern validator to an input attached to an
- * ngModel binding.
- *
- * ```html
- * <input name="firstName" ngModel pattern="[a-zA-Z ]*">
- * ```
- *
- * @ngModule ReactiveFormsModule
- * @ngModule FormsModule
- * @publicApi
- */
- export declare class PatternValidator implements Validator, OnChanges {
- private _validator;
- private _onChange;
- /**
- * @description
- * Tracks changes to the pattern bound to this directive.
- */
- pattern: string | RegExp;
- /**
- * @description
- * A lifecycle method called when the directive's inputs change. For internal use
- * only.
- *
- * @param changes A object of key/value pairs for the set of changed inputs.
- */
- ngOnChanges(changes: SimpleChanges): void;
- /**
- * @description
- * Method that validates whether the value matches the
- * the pattern requirement.
- */
- validate(control: AbstractControl): ValidationErrors | null;
- /**
- * @description
- * Registers a callback function to call when the validator inputs change.
- *
- * @param fn The callback function
- */
- registerOnValidatorChange(fn: () => void): void;
- private _createValidator;
- }
- /**
- * @description
- * The `ControlValueAccessor` for writing radio control values and listening to radio control
- * changes. The value accessor is used by the `FormControlDirective`, `FormControlName`, and
- * `NgModel` directives.
- *
- * @usageNotes
- *
- * ### Using radio buttons with reactive form directives
- *
- * The follow example shows how to use radio buttons in a reactive form. When using radio buttons in
- * a reactive form, radio buttons in the same group should have the same `formControlName`.
- * Providing a `name` attribute is optional.
- *
- * {@example forms/ts/reactiveRadioButtons/reactive_radio_button_example.ts region='Reactive'}
- *
- * @ngModule ReactiveFormsModule
- * @ngModule FormsModule
- * @publicApi
- */
- export declare class RadioControlValueAccessor implements ControlValueAccessor, OnDestroy, OnInit {
- private _renderer;
- private _elementRef;
- private _registry;
- private _injector;
- /**
- * @description
- * The registered callback function called when a change event occurs on the input element.
- */
- onChange: () => void;
- /**
- * @description
- * The registered callback function called when a blur event occurs on the input element.
- */
- onTouched: () => void;
- /**
- * @description
- * Tracks the name of the radio input element.
- */
- name: string;
- /**
- * @description
- * Tracks the name of the `FormControl` bound to the directive. The name corresponds
- * to a key in the parent `FormGroup` or `FormArray`.
- */
- formControlName: string;
- /**
- * @description
- * Tracks the value of the radio input element
- */
- value: any;
- constructor(_renderer: Renderer2, _elementRef: ElementRef, _registry: ɵangular_packages_forms_forms_o, _injector: Injector);
- /**
- * @description
- * A lifecycle method called when the directive is initialized. For internal use only.
- *
- * @param changes A object of key/value pairs for the set of changed inputs.
- */
- ngOnInit(): void;
- /**
- * @description
- * Lifecycle method called before the directive's instance is destroyed. For internal use only.
- *
- * @param changes A object of key/value pairs for the set of changed inputs.
- */
- ngOnDestroy(): void;
- /**
- * @description
- * Sets the "checked" property value on the radio input element.
- *
- * @param value The checked value
- */
- writeValue(value: any): void;
- /**
- * @description
- * Registers a function called when the control value changes.
- *
- * @param fn The callback function
- */
- registerOnChange(fn: (_: any) => {}): void;
- /**
- * Sets the "value" on the radio input element and unchecks it.
- *
- * @param value
- */
- fireUncheck(value: any): void;
- /**
- * @description
- * Registers a function called when the control is touched.
- *
- * @param fn The callback function
- */
- registerOnTouched(fn: () => {}): void;
- /**
- * Sets the "disabled" property on the input element.
- *
- * @param isDisabled The disabled value
- */
- setDisabledState(isDisabled: boolean): void;
- private _checkName;
- private _throwNameError;
- }
- /**
- * @description
- * The `ControlValueAccessor` for writing a range value and listening to range input changes.
- * The value accessor is used by the `FormControlDirective`, `FormControlName`, and `NgModel`
- * directives.
- *
- * @usageNotes
- *
- * ### Using a range input with a reactive form
- *
- * The following example shows how to use a range input with a reactive form.
- *
- * ```ts
- * const ageControl = new FormControl();
- * ```
- *
- * ```
- * <input type="range" [formControl]="ageControl">
- * ```
- *
- * @ngModule ReactiveFormsModule
- * @ngModule FormsModule
- * @publicApi
- */
- export declare class RangeValueAccessor implements ControlValueAccessor {
- private _renderer;
- private _elementRef;
- /**
- * @description
- * The registered callback function called when a change or input event occurs on the input
- * element.
- */
- onChange: (_: any) => void;
- /**
- * @description
- * The registered callback function called when a blur event occurs on the input element.
- */
- onTouched: () => void;
- constructor(_renderer: Renderer2, _elementRef: ElementRef);
- /**
- * Sets the "value" property on the input element.
- *
- * @param value The checked value
- */
- writeValue(value: any): void;
- /**
- * @description
- * Registers a function called when the control value changes.
- *
- * @param fn The callback function
- */
- registerOnChange(fn: (_: number | null) => void): void;
- /**
- * @description
- * Registers a function called when the control is touched.
- *
- * @param fn The callback function
- */
- registerOnTouched(fn: () => void): void;
- /**
- * Sets the "disabled" property on the range input element.
- *
- * @param isDisabled The disabled value
- */
- setDisabledState(isDisabled: boolean): void;
- }
- /**
- * Exports the required infrastructure and directives for reactive forms,
- * making them available for import by NgModules that import this module.
- * @see [Forms](guide/reactive-forms)
- *
- * @see [Reactive Forms Guide](/guide/reactive-forms)
- *
- * @publicApi
- */
- export declare class ReactiveFormsModule {
- /**
- * @description
- * Provides options for configuring the reactive forms module.
- *
- * @param opts An object of configuration options
- * * `warnOnNgModelWithFormControl` Configures when to emit a warning when an `ngModel`
- * binding is used with reactive form directives.
- */
- static withConfig(opts: {
- /** @deprecated as of v6 */ warnOnNgModelWithFormControl: 'never' | 'once' | 'always';
- }): ModuleWithProviders<ReactiveFormsModule>;
- }
- /**
- * @description
- * A directive that adds the `required` validator to any controls marked with the
- * `required` attribute. The directive is provided with the `NG_VALIDATORS` multi-provider list.
- *
- * @see [Form Validation](guide/form-validation)
- *
- * @usageNotes
- *
- * ### Adding a required validator using template-driven forms
- *
- * ```
- * <input name="fullName" ngModel required>
- * ```
- *
- * @ngModule FormsModule
- * @ngModule ReactiveFormsModule
- * @publicApi
- */
- export declare class RequiredValidator implements Validator {
- private _required;
- private _onChange;
- /**
- * @description
- * Tracks changes to the required attribute bound to this directive.
- */
- required: boolean | string;
- /**
- * @description
- * Method that validates whether the control is empty.
- * Returns the validation result if enabled, otherwise null.
- */
- validate(control: AbstractControl): ValidationErrors | null;
- /**
- * @description
- * Registers a callback function to call when the validator inputs change.
- *
- * @param fn The callback function
- */
- registerOnValidatorChange(fn: () => void): void;
- }
- /**
- * @description
- * The `ControlValueAccessor` for writing select control values and listening to select control
- * changes. The value accessor is used by the `FormControlDirective`, `FormControlName`, and
- * `NgModel` directives.
- *
- * @usageNotes
- *
- * ### Using select controls in a reactive form
- *
- * The following examples show how to use a select control in a reactive form.
- *
- * {@example forms/ts/reactiveSelectControl/reactive_select_control_example.ts region='Component'}
- *
- * ### Using select controls in a template-driven form
- *
- * To use a select in a template-driven form, simply add an `ngModel` and a `name`
- * attribute to the main `<select>` tag.
- *
- * {@example forms/ts/selectControl/select_control_example.ts region='Component'}
- *
- * ### Customizing option selection
- *
- * Angular uses object identity to select option. It's possible for the identities of items
- * to change while the data does not. This can happen, for example, if the items are produced
- * from an RPC to the server, and that RPC is re-run. Even if the data hasn't changed, the
- * second response will produce objects with different identities.
- *
- * To customize the default option comparison algorithm, `<select>` supports `compareWith` input.
- * `compareWith` takes a **function** which has two arguments: `option1` and `option2`.
- * If `compareWith` is given, Angular selects option by the return value of the function.
- *
- * ```ts
- * const selectedCountriesControl = new FormControl();
- * ```
- *
- * ```
- * <select [compareWith]="compareFn" [formControl]="selectedCountriesControl">
- * <option *ngFor="let country of countries" [ngValue]="country">
- * {{country.name}}
- * </option>
- * </select>
- *
- * compareFn(c1: Country, c2: Country): boolean {
- * return c1 && c2 ? c1.id === c2.id : c1 === c2;
- * }
- * ```
- *
- * **Note:** We listen to the 'change' event because 'input' events aren't fired
- * for selects in Firefox and IE:
- * https://bugzilla.mozilla.org/show_bug.cgi?id=1024350
- * https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/4660045/
- *
- * @ngModule ReactiveFormsModule
- * @ngModule FormsModule
- * @publicApi
- */
- export declare class SelectControlValueAccessor implements ControlValueAccessor {
- private _renderer;
- private _elementRef;
- value: any;
- /**
- * @description
- * The registered callback function called when a change event occurs on the input element.
- */
- onChange: (_: any) => void;
- /**
- * @description
- * The registered callback function called when a blur event occurs on the input element.
- */
- onTouched: () => void;
- /**
- * @description
- * Tracks the option comparison algorithm for tracking identities when
- * checking for changes.
- */
- compareWith: (o1: any, o2: any) => boolean;
- private _compareWith;
- constructor(_renderer: Renderer2, _elementRef: ElementRef);
- /**
- * Sets the "value" property on the input element. The "selectedIndex"
- * property is also set if an ID is provided on the option element.
- *
- * @param value The checked value
- */
- writeValue(value: any): void;
- /**
- * @description
- * Registers a function called when the control value changes.
- *
- * @param fn The callback function
- */
- registerOnChange(fn: (value: any) => any): void;
- /**
- * @description
- * Registers a function called when the control is touched.
- *
- * @param fn The callback function
- */
- registerOnTouched(fn: () => any): void;
- /**
- * Sets the "disabled" property on the select input element.
- *
- * @param isDisabled The disabled value
- */
- setDisabledState(isDisabled: boolean): void;
- }
- /**
- * @description
- * The `ControlValueAccessor` for writing multi-select control values and listening to multi-select control
- * changes. The value accessor is used by the `FormControlDirective`, `FormControlName`, and `NgModel`
- * directives.
- *
- * @see `SelectControlValueAccessor`
- *
- * @usageNotes
- *
- * ### Using a multi-select control
- *
- * The follow example shows you how to use a multi-select control with a reactive form.
- *
- * ```ts
- * const countryControl = new FormControl();
- * ```
- *
- * ```
- * <select multiple name="countries" [formControl]="countryControl">
- * <option *ngFor="let country of countries" [ngValue]="country">
- * {{ country.name }}
- * </option>
- * </select>
- * ```
- *
- * ### Customizing option selection
- *
- * To customize the default option comparison algorithm, `<select>` supports `compareWith` input.
- * See the `SelectControlValueAccessor` for usage.
- *
- * @ngModule ReactiveFormsModule
- * @ngModule FormsModule
- * @publicApi
- */
- export declare class SelectMultipleControlValueAccessor implements ControlValueAccessor {
- private _renderer;
- private _elementRef;
- /**
- * @description
- * The current value
- */
- value: any;
- /**
- * @description
- * The registered callback function called when a change event occurs on the input element.
- */
- onChange: (_: any) => void;
- /**
- * @description
- * The registered callback function called when a blur event occurs on the input element.
- */
- onTouched: () => void;
- /**
- * @description
- * Tracks the option comparison algorithm for tracking identities when
- * checking for changes.
- */
- compareWith: (o1: any, o2: any) => boolean;
- private _compareWith;
- constructor(_renderer: Renderer2, _elementRef: ElementRef);
- /**
- * @description
- * Sets the "value" property on one or of more
- * of the select's options.
- *
- * @param value The value
- */
- writeValue(value: any): void;
- /**
- * @description
- * Registers a function called when the control value changes
- * and writes an array of the selected options.
- *
- * @param fn The callback function
- */
- registerOnChange(fn: (value: any) => any): void;
- /**
- * @description
- * Registers a function called when the control is touched.
- *
- * @param fn The callback function
- */
- registerOnTouched(fn: () => any): void;
- /**
- * Sets the "disabled" property on the select input element.
- *
- * @param isDisabled The disabled value
- */
- setDisabledState(isDisabled: boolean): void;
- }
- /**
- * @description
- * Defines the map of errors returned from failed validation checks.
- *
- * @publicApi
- */
- export declare type ValidationErrors = {
- [key: string]: any;
- };
- /**
- * @description
- * An interface implemented by classes that perform synchronous validation.
- *
- * @usageNotes
- *
- * ### Provide a custom validator
- *
- * The following example implements the `Validator` interface to create a
- * validator directive with a custom error key.
- *
- * ```typescript
- * @Directive({
- * selector: '[customValidator]',
- * providers: [{provide: NG_VALIDATORS, useExisting: CustomValidatorDirective, multi: true}]
- * })
- * class CustomValidatorDirective implements Validator {
- * validate(control: AbstractControl): ValidationErrors|null {
- * return {'custom': true};
- * }
- * }
- * ```
- *
- * @publicApi
- */
- export declare interface Validator {
- /**
- * @description
- * Method that performs synchronous validation against the provided control.
- *
- * @param control The control to validate against.
- *
- * @returns A map of validation errors if validation fails,
- * otherwise null.
- */
- validate(control: AbstractControl): ValidationErrors | null;
- /**
- * @description
- * Registers a callback function to call when the validator inputs change.
- *
- * @param fn The callback function
- */
- registerOnValidatorChange?(fn: () => void): void;
- }
- /**
- * @description
- * A function that receives a control and synchronously returns a map of
- * validation errors if present, otherwise null.
- *
- * @publicApi
- */
- export declare interface ValidatorFn {
- (control: AbstractControl): ValidationErrors | null;
- }
- /**
- * @description
- * Provides a set of built-in validators that can be used by form controls.
- *
- * A validator is a function that processes a `FormControl` or collection of
- * controls and returns an error map or null. A null map means that validation has passed.
- *
- * @see [Form Validation](/guide/form-validation)
- *
- * @publicApi
- */
- export declare class Validators {
- /**
- * @description
- * Validator that requires the control's value to be greater than or equal to the provided number.
- * The validator exists only as a function and not as a directive.
- *
- * @usageNotes
- *
- * ### Validate against a minimum of 3
- *
- * ```typescript
- * const control = new FormControl(2, Validators.min(3));
- *
- * console.log(control.errors); // {min: {min: 3, actual: 2}}
- * ```
- *
- * @returns A validator function that returns an error map with the
- * `min` property if the validation check fails, otherwise `null`.
- *
- */
- static min(min: number): ValidatorFn;
- /**
- * @description
- * Validator that requires the control's value to be less than or equal to the provided number.
- * The validator exists only as a function and not as a directive.
- *
- * @usageNotes
- *
- * ### Validate against a maximum of 15
- *
- * ```typescript
- * const control = new FormControl(16, Validators.max(15));
- *
- * console.log(control.errors); // {max: {max: 15, actual: 16}}
- * ```
- *
- * @returns A validator function that returns an error map with the
- * `max` property if the validation check fails, otherwise `null`.
- *
- */
- static max(max: number): ValidatorFn;
- /**
- * @description
- * Validator that requires the control have a non-empty value.
- *
- * @usageNotes
- *
- * ### Validate that the field is non-empty
- *
- * ```typescript
- * const control = new FormControl('', Validators.required);
- *
- * console.log(control.errors); // {required: true}
- * ```
- *
- * @returns An error map with the `required` property
- * if the validation check fails, otherwise `null`.
- *
- */
- static required(control: AbstractControl): ValidationErrors | null;
- /**
- * @description
- * Validator that requires the control's value be true. This validator is commonly
- * used for required checkboxes.
- *
- * @usageNotes
- *
- * ### Validate that the field value is true
- *
- * ```typescript
- * const control = new FormControl('', Validators.requiredTrue);
- *
- * console.log(control.errors); // {required: true}
- * ```
- *
- * @returns An error map that contains the `required` property
- * set to `true` if the validation check fails, otherwise `null`.
- */
- static requiredTrue(control: AbstractControl): ValidationErrors | null;
- /**
- * @description
- * Validator that requires the control's value pass an email validation test.
- *
- * @usageNotes
- *
- * ### Validate that the field matches a valid email pattern
- *
- * ```typescript
- * const control = new FormControl('bad@', Validators.email);
- *
- * console.log(control.errors); // {email: true}
- * ```
- *
- * @returns An error map with the `email` property
- * if the validation check fails, otherwise `null`.
- *
- */
- static email(control: AbstractControl): ValidationErrors | null;
- /**
- * @description
- * Validator that requires the length of the control's value to be greater than or equal
- * to the provided minimum length. This validator is also provided by default if you use the
- * the HTML5 `minlength` attribute.
- *
- * @usageNotes
- *
- * ### Validate that the field has a minimum of 3 characters
- *
- * ```typescript
- * const control = new FormControl('ng', Validators.minLength(3));
- *
- * console.log(control.errors); // {minlength: {requiredLength: 3, actualLength: 2}}
- * ```
- *
- * ```html
- * <input minlength="5">
- * ```
- *
- * @returns A validator function that returns an error map with the
- * `minlength` if the validation check fails, otherwise `null`.
- */
- static minLength(minLength: number): ValidatorFn;
- /**
- * @description
- * Validator that requires the length of the control's value to be less than or equal
- * to the provided maximum length. This validator is also provided by default if you use the
- * the HTML5 `maxlength` attribute.
- *
- * @usageNotes
- *
- * ### Validate that the field has maximum of 5 characters
- *
- * ```typescript
- * const control = new FormControl('Angular', Validators.maxLength(5));
- *
- * console.log(control.errors); // {maxlength: {requiredLength: 5, actualLength: 7}}
- * ```
- *
- * ```html
- * <input maxlength="5">
- * ```
- *
- * @returns A validator function that returns an error map with the
- * `maxlength` property if the validation check fails, otherwise `null`.
- */
- static maxLength(maxLength: number): ValidatorFn;
- /**
- * @description
- * Validator that requires the control's value to match a regex pattern. This validator is also
- * provided by default if you use the HTML5 `pattern` attribute.
- *
- * Note that if a Regexp is provided, the Regexp is used as is to test the values. On the other
- * hand, if a string is passed, the `^` character is prepended and the `$` character is
- * appended to the provided string (if not already present), and the resulting regular
- * expression is used to test the values.
- *
- * @usageNotes
- *
- * ### Validate that the field only contains letters or spaces
- *
- * ```typescript
- * const control = new FormControl('1', Validators.pattern('[a-zA-Z ]*'));
- *
- * console.log(control.errors); // {pattern: {requiredPattern: '^[a-zA-Z ]*$', actualValue: '1'}}
- * ```
- *
- * ```html
- * <input pattern="[a-zA-Z ]*">
- * ```
- *
- * @returns A validator function that returns an error map with the
- * `pattern` property if the validation check fails, otherwise `null`.
- */
- static pattern(pattern: string | RegExp): ValidatorFn;
- /**
- * @description
- * Validator that performs no operation.
- */
- static nullValidator(control: AbstractControl): ValidationErrors | null;
- /**
- * @description
- * Compose multiple validators into a single function that returns the union
- * of the individual error maps for the provided control.
- *
- * @returns A validator function that returns an error map with the
- * merged error maps of the validators if the validation check fails, otherwise `null`.
- */
- static compose(validators: null): null;
- static compose(validators: (ValidatorFn | null | undefined)[]): ValidatorFn | null;
- /**
- * @description
- * Compose multiple async validators into a single function that returns the union
- * of the individual error objects for the provided control.
- *
- * @returns A validator function that returns an error map with the
- * merged error objects of the async validators if the validation check fails, otherwise `null`.
- */
- static composeAsync(validators: (AsyncValidatorFn | null)[]): AsyncValidatorFn | null;
- }
- /**
- * @publicApi
- */
- export declare const VERSION: Version;
- export declare const ɵangular_packages_forms_forms_a: Type<any>[];
- export declare const ɵangular_packages_forms_forms_b: Type<any>[];
- /**
- * @description
- * Provider which adds `RequiredValidator` to the `NG_VALIDATORS` multi-provider list.
- */
- export declare const ɵangular_packages_forms_forms_ba: StaticProvider;
- /**
- * @description
- * Provider which adds `CheckboxRequiredValidator` to the `NG_VALIDATORS` multi-provider list.
- */
- export declare const ɵangular_packages_forms_forms_bb: StaticProvider;
- /**
- * @description
- * Provider which adds `EmailValidator` to the `NG_VALIDATORS` multi-provider list.
- */
- export declare const ɵangular_packages_forms_forms_bc: any;
- /**
- * @description
- * Provider which adds `MinLengthValidator` to the `NG_VALIDATORS` multi-provider list.
- */
- export declare const ɵangular_packages_forms_forms_bd: any;
- /**
- * @description
- * Provider which adds `MaxLengthValidator` to the `NG_VALIDATORS` multi-provider list.
- */
- export declare const ɵangular_packages_forms_forms_be: any;
- /**
- * @description
- * Provider which adds `PatternValidator` to the `NG_VALIDATORS` multi-provider list.
- */
- export declare const ɵangular_packages_forms_forms_bf: any;
- export declare const ɵangular_packages_forms_forms_c: Type<any>[];
- export declare const ɵangular_packages_forms_forms_e: any;
- export declare const ɵangular_packages_forms_forms_f: any;
- export declare class ɵangular_packages_forms_forms_g {
- private _cd;
- constructor(cd: AbstractControlDirective);
- readonly ngClassUntouched: boolean;
- readonly ngClassTouched: boolean;
- readonly ngClassPristine: boolean;
- readonly ngClassDirty: boolean;
- readonly ngClassValid: boolean;
- readonly ngClassInvalid: boolean;
- readonly ngClassPending: boolean;
- }
- export declare const ɵangular_packages_forms_forms_h: {
- '[class.ng-untouched]': string;
- '[class.ng-touched]': string;
- '[class.ng-pristine]': string;
- '[class.ng-dirty]': string;
- '[class.ng-valid]': string;
- '[class.ng-invalid]': string;
- '[class.ng-pending]': string;
- };
- export declare const ɵangular_packages_forms_forms_i: any;
- /**
- * @description
- * `InjectionToken` to provide to turn off the warning when using 'ngForm' deprecated selector.
- */
- export declare const ɵangular_packages_forms_forms_j: InjectionToken<{}>;
- export declare const ɵangular_packages_forms_forms_k: any;
- export declare const ɵangular_packages_forms_forms_l: any;
- export declare const ɵangular_packages_forms_forms_m: any;
- export declare const ɵangular_packages_forms_forms_n: any;
- /**
- * @description
- * Class used by Angular to track radio buttons. For internal use only.
- */
- export declare class ɵangular_packages_forms_forms_o {
- private _accessors;
- /**
- * @description
- * Adds a control to the internal registry. For internal use only.
- */
- add(control: NgControl, accessor: RadioControlValueAccessor): void;
- /**
- * @description
- * Removes a control from the internal registry. For internal use only.
- */
- remove(accessor: RadioControlValueAccessor): void;
- /**
- * @description
- * Selects a radio button. For internal use only.
- */
- select(accessor: RadioControlValueAccessor): void;
- private _isSameGroup;
- }
- export declare const ɵangular_packages_forms_forms_p: StaticProvider;
- /**
- * Token to provide to turn off the ngModel warning on formControl and formControlName.
- */
- export declare const ɵangular_packages_forms_forms_q: InjectionToken<{}>;
- export declare const ɵangular_packages_forms_forms_r: any;
- export declare const ɵangular_packages_forms_forms_s: any;
- export declare const ɵangular_packages_forms_forms_t: any;
- export declare const ɵangular_packages_forms_forms_u: any;
- export declare const ɵangular_packages_forms_forms_v: any;
- export declare const ɵangular_packages_forms_forms_w: StaticProvider;
- export declare const ɵangular_packages_forms_forms_x: StaticProvider;
- /**
- * Internal module used for sharing directives between FormsModule and ReactiveFormsModule
- */
- declare class ɵInternalFormsSharedModule {
- }
- export { ɵInternalFormsSharedModule }
- export { ɵInternalFormsSharedModule as ɵangular_packages_forms_forms_d }
- /**
- * @description
- *
- * Adds `novalidate` attribute to all forms by default.
- *
- * `novalidate` is used to disable browser's native form validation.
- *
- * If you want to use native validation with Angular forms, just add `ngNativeValidate` attribute:
- *
- * ```
- * <form ngNativeValidate></form>
- * ```
- *
- * @publicApi
- * @ngModule ReactiveFormsModule
- * @ngModule FormsModule
- */
- declare class ɵNgNoValidate {
- }
- export { ɵNgNoValidate }
- export { ɵNgNoValidate as ɵangular_packages_forms_forms_z }
- /**
- * @description
- * Marks `<option>` as dynamic, so Angular can be notified when options change.
- *
- * @see `SelectMultipleControlValueAccessor`
- *
- * @ngModule ReactiveFormsModule
- * @ngModule FormsModule
- * @publicApi
- */
- declare class ɵNgSelectMultipleOption implements OnDestroy {
- private _element;
- private _renderer;
- private _select;
- id: string;
- constructor(_element: ElementRef, _renderer: Renderer2, _select: SelectMultipleControlValueAccessor);
- /**
- * @description
- * Tracks the value bound to the option element. Unlike the value binding,
- * ngValue supports binding to objects.
- */
- ngValue: any;
- /**
- * @description
- * Tracks simple string values bound to the option element.
- * For objects, use the `ngValue` input binding.
- */
- value: any;
- /**
- * @description
- * Lifecycle method called before the directive's instance is destroyed. For internal use only.
- */
- ngOnDestroy(): void;
- }
- export { ɵNgSelectMultipleOption }
- export { ɵNgSelectMultipleOption as ɵangular_packages_forms_forms_y }
- export { }
|