Cannot Push Array of Values to a Json Typescript Angular

Question

I have a object

formErrors = {
    'name': [],
    'age' : []
  };

I am adding validation errors to it Dynamically from a Template Driven form . But when i try to push values to the key it throws errors and when i just assign it a normal string it works.

onValueChanged(data?: any) {
    if (!this.f) { return; }
    const form = this.f.form;

    for (const field in this.formErrors) {
      // clear previous error message (if any)
      this.formErrors[field] = '';
      const control = form.get(field);

      if (control && control.dirty && !control.valid) {
        const messages = this.validationMessages[field];
        for (const key in control.errors) {
          this.formErrors[field].push(messages[key]); // error line
          this.formErrors[field] += messages[key] + ' '; // this works if the change object struct to name :''
        }
      }
    }
  }

The error in console is

TemplateDrivenComponent.html:10 ERROR TypeError: this.formErrors[field].push is not a function
    at 

    TemplateDrivenComponent.webpackJsonp.178.TemplateDrivenComponent.onValueChanged (template-driven.component.ts:46)
        at template-driven.component.ts:29
        at SafeSubscriber.schedulerFn [as _next] (core.es5.js:3840)
        at SafeSubscriber.__tryOrUnsub (Subscriber.js:236)
        at SafeSubscriber.next (Subscriber.js:185)
        at Subscriber._next (Subscriber.js:125)
        at Subscriber.next (Subscriber.js:89)
        at EventEmitter.Subject.next (Subject.js:55)
        at EventEmitter.emit (core.es5.js:3814)
        at FormGroup.AbstractControl.updateValueAndValidity (forms.es5.js:2601)
        at FormControl.AbstractControl.updateValueAndValidity (forms.es5.js:2605)
        at FormControl.setValue (forms.es5.js:2948)
        at DefaultValueAccessor.onChange (forms.es5.js:1752)
        at DefaultValueAccessor._handleInput (forms.es5.js:619)
        at Object.eval [as handleEvent] (TemplateDrivenComponent.html:10)

because u have intitalized it to a string this.formErrors[field] = ''; push works on array & Not String. — Parth Ghiya
– Parth Ghiya, Commented May 18, 2017 at 8:13
You are replacing your arrays with strings this.formErrors[field] = ''; I think you meant an empty array to "clear errors" []. — Neil Lunn
– Neil Lunn, Commented May 18, 2017 at 8:14
nope i want to push these error messages to the array , and the space ' ' is only to give spacing when i was not using array now i want to use array — Rahul
– Rahul, Commented May 18, 2017 at 8:34
Your last line works because you are concatenating a string, but if you want it to be an array to push to, then you need to clear it by reinitialise get as an empty array this.formErrors[field] = [] — alechill
– alechill, Commented May 18, 2017 at 8:40

Parth Ghiya · Accepted Answer · 2017-05-18 08:43:31Z

2

because u have intitalized it to a string

this.formErrors[field] = '';

push works on array & Not String

change that line to

this.formErrors[field] = [];

answered May 18, 2017 at 8:43

Parth Ghiya

6,9692 gold badges32 silver badges37 bronze badges

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

Collectives™ on Stack Overflow

Cannot Push Array of Values to a Json Typescript Angular

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related