Reactive form-validation-angular2

Question

I am able to get the values from the child but I need to validate the values in my parent component that is present or not.

parent.html :

<browser (notify)="onselect($event)"  [template]="coreActivity" (onselect)="onselect($event)" formControlName="template" ></browser>

parent.ts :

export class CreateCommunityComponent implements OnInit {  userForm: FormGroup;  public tagarray=[];   coreActivity = [
   {value: 'Professional', viewValue: 'Professional', tool: 'Forum' },
   {value: 'Travel', viewValue: 'Travel', tool: 'quora'},
   {value: 'Arts', viewValue: 'Arts', tool: 'stackoverflow'},
   {value: 'Technology', viewValue: 'Technology', tool: 'quora'},
   {value: 'Business', viewValue: 'Business', tool: 'Forum'},
   {value: 'Science', viewValue: 'Science', tool: 'quora'},
   {value: 'Education', viewValue: 'Education', tool: 'quora'}
 ];    visibility = [
     {value: 'Public', viewValue: 'Public'},
     {value: 'Private', viewValue: 'Private'},
     {value: 'Moderate', viewValue: 'Moderate'}
   ];    tags = [
     {value: 'tag-one', viewValue: 'tagone'},
     {value: 'tag-two', viewValue: 'tagtwo' },
     {value: 'tag-three', viewValue: 'tagthree'}
   ];
 constructor(private dialog: MdDialog, private fb: FormBuilder,private router: Router) {    this.createForm();    }  createForm() {
       this.userForm = this.fb.group({
         domainName: ['', [Validators.required, Validators.pattern('[a-z.]{8,20}')]],
         communityName: ['', Validators.required],
         Purpose: ['', Validators.required],
         visibility: ['Public', Validators.required],
         template: ['',Validators.required],
         tagSelection: ['', Validators.required],
         termscondition: ['', Validators.required]
       });
   }
//  check whether the card is clickable or not 
onselect(selectedTemplate: any)
{
  console.log(selectedTemplate);
  return selectedTemplate;
}

It is giving error while I am validating the child value is present or not:

ERROR Error: No value accessor for form control with name: 'template'

please provide some more html content

The Hungry Dictator
– The Hungry Dictator

2017-06-20 06:52:57 +00:00
Commented Jun 20, 2017 at 6:52 — The Hungry Dictator
– The Hungry Dictator, Commented Jun 20, 2017 at 6:52
Have you imported FormsModule and ReactiveFormsModule?

The Hungry Dictator
– The Hungry Dictator

2017-06-20 06:54:39 +00:00
Commented Jun 20, 2017 at 6:54 — The Hungry Dictator
– The Hungry Dictator, Commented Jun 20, 2017 at 6:54
Could you add the template for the child as well?

AVJT82
– AVJT82

2017-06-23 16:03:45 +00:00
Commented Jun 23, 2017 at 16:03 — AVJT82
– AVJT82, Commented Jun 23, 2017 at 16:03

The Hungry Dictator · Accepted Answer · 2017-06-20 06:30:23Z

0

You need to add ngDefaultControl to your <browser> tag.

<browser ngDefaultControl (notify)="onselect($event)"  
  [template]="coreActivity" (onselect)="onselect($event)" 
formControlName="template" ></browser>

Hope this will work for you.

answered Jun 20, 2017 at 6:30

The Hungry Dictator

3,4845 gold badges41 silver badges56 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Nikita Raturi Over a year ago

i am using formgroup to validate my form fields and i need to validate the template field using formcontrol

The Hungry Dictator Over a year ago

Can you remove and try that ?

Nikita Raturi Over a year ago

getting an error :ERROR Error: No value accessor for form control with name: 'template'

The Hungry Dictator Over a year ago

Same error you are getting when you are removing the formGorup?

Collectives™ on Stack Overflow

Reactive form-validation-angular2

1 Answer 1

4 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related