Questions tagged [controlvalueaccessor]

161 questions
25
votes
1 answer

Inconsistent validation issue in Angular custom component

To show a kind of real world example, let's say that we want to use the @angular/material's datepicker in our application. We want to use it on a lot of pages, so we want to make it very easy to add it to a form with the same configuration…
23
votes
3 answers

Angular: How to temporarily highlight dom elements that have just changed?

Before implementing a solution on my own I would like to know if there is a simple manner to change the style of an element (a brief highlight) when the data bound property value has just change. There are lot of elements in my DOM so I do not not…
Anthony Brenelière
  • 60,646
  • 14
  • 46
  • 58
14
votes
5 answers

Angular Two-Way Data Binding and Watching for Changes in Parent Component

It seems there is no way to watch changes in the parent component when using two-way data binding. I have a custom input component for collecting a tag list. Two-way data binding is setup and working between this component and its parent. // the…
10
votes
7 answers

Angular reactive form custom control async validation

UPDATE: Issue with async validation successfully solved. But there is another issue with initial validation state. See latest answer. Here is the trick: Have component with implemented ControlValueAccessor interface to be used as custom…
9
votes
2 answers

Is forwardRef mandatory while creating NG_VALUE_ACCESSOR

I have a custom input component which implements ControlValueAccessor with providers declared as follows. It seems to work fine. In all the tutorials I could find on the internet, forwardRef was being used extensively whenever NG_VALUE_ACCESSOR is…
Surya KLSV
  • 1,260
  • 4
  • 18
  • 26
6
votes
2 answers

How To Use A Directive In A Custom Input With ControlValueAccessor Angular

I've been create a simple custom input component in my angular app use ControlValueAccessor. So, when I want to create a form input element, I don't have to call , only call . I have a problem, when I use , I can use…
Titus Sutio Fanpula
  • 3,467
  • 4
  • 14
  • 33
6
votes
1 answer

Error when using Control Value Accessor in Angular

I have implemented Control Value Accessor in my application but when running the application I get the following error message: ERROR TypeError: dir.valueAccessor.writeValue is not a function at setUpControl (forms.js:2578) at…
MazW
  • 125
  • 2
  • 10
5
votes
2 answers

angular validation state of a nested ControlValueAccessor is not correctly propagated in parents, how to implement this validation?

I have an issue in an angular 10 app, with the propagation of the state of a formGroup to its parent, at initialization. Issue: at component initialization, the validation state of a sub-form is not correctly propagated in parents of more than one…
5
votes
2 answers

Passing formControlName into Angular component

I have a reactive form. The setup is similar to this: myForm: FormGroup; this.myForm= new FormGroup({ name: new FormControl("", [Validators.required, Validators.maxLength(15), Validators.pattern('...')]), ... }); I use this…
4
votes
1 answer

Why is Angular calling `registerOnChange` after `ngOnDestroy` on custom ControlValueAccessor component?

After creating a custom form element, I noticed that when I navigated away from a route that hosted that custom form element, Angular would call the form element's ngOnDestroy method and then it would call the form element's registerOnChange and…
4
votes
1 answer

Angular Reactive Form, ControlValueAccessor vs. PropertyBinding

i have some form components which in fact just wrap some parts of a big formular into little pieces. I can imagine two ways to do that: a ControlValueAccessor or s simple PropertyBinding to pass in the FormControl to the…
4
votes
1 answer

ControlValueAccessor ngModel not being updated

This is simple custom form control @Component({ selector: 'app-custom-control', template: ` {{ value }} `, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting:…
user7003407
4
votes
0 answers

How to implement multiple level (nested) component using ControlValueAccessor

I have a complicate form which need 4~5 levels of nested form. I have couple of components, all of them implements ControlValueAccessor and the return type is an object array. Instead of return a FormGroup, is there any way to return a FormArray so…
Neardreams
  • 125
  • 9
4
votes
5 answers

Angular 7 - ControlValueAccessor - Trim input values that are binded to a form

We have a input field on a web page that must be trimmed at the same time as the user enter that data. As the input is binded to an Angular Form the value in the Form must also be trimmed. I use Angular 7 import { Directive, ElementRef, …
user286974
  • 111
  • 1
  • 1
  • 12
4
votes
1 answer

How do I create a custom Reactive Form Element?

I'm working with Reactive Forms in Angular and I'm trying to create a custom form element so I can use buttons with my form. I'm trying to follow a tutorial from Alligator.io, but it isn't clear how to integrate this into my component. Currently I'm…
London804
  • 1,072
  • 1
  • 22
  • 47
1
2 3
10 11