Angular6/Typescript - ERROR when trying to Add Object to Array

Question

I am failing to add a class into my Array. Error message: ERROR TypeError: Cannot read property 'value' of undefined

class

   export class Essensplan {

   id: number;
   EssenProWoche: number[] = new Array(5);

  }

service.ts

 / POST: add a new essensplan to the server */
  addEssensplan(essensplan: Essensplan): Observable<Essensplan> {
    return this.http.post<Essensplan>(this.essensplanUrl, essensplan, 
httpOptions).pipe(
      tap((essensplan: Essensplan) => this.log(added essen w/ 
id=${essensplan.id})),
      catchError(this.handleError<Essensplan>('addEssensplan'))
   );
  }

component

  addEssensplan(id: number): void {
    // id = id.trim();
    if (!id) { return; }
    this.essensplanService.addEssensplan({ id } as Essensplan)
      .subscribe(essensplan => {
        this.essensplan.push(essensplan);
        this.changeDetector.markForCheck();
      });
  }

Template**

<div>
  <label>Essensplan Woche:
<input type=number #Wochennummer />
  </label>
  <!-- (click) passes input value to add() and then clears the input -->
  <button (click)="addEssensplan(essensplanid.value); essensplanid.value=''">
    add
  </button>

It seems like it can not read an ID in the Text field, is it possible to convert the String (?) input into a number

in your code there is no mention of the variable essensplanid. Are you sure this is defined somewhere, and that it shouldn't be just essensplan.value? — Poul Kruijt
– Poul Kruijt, Commented Sep 12, 2018 at 11:04

Ascena · Accepted Answer · 2018-09-12 11:12:02Z

1

your essensplanid.value is not defined, because in the input you wrote #Wochennummer.

just change essensplan.id to #Wochennummer or the other way

<div>
 <label>Essensplan Woche:
    <input type="number"  #Wochennummer />
  </label>
  <!-- (click) passes input value to add() and then clears the input -->
  <button (click)="addEssensplan(Wochennummer.value); Wochennummer.value=''">
   add
   </button>
</div>

answered Sep 12, 2018 at 11:12

Ascena

607 bronze badges

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

Collectives™ on Stack Overflow

Angular6/Typescript - ERROR when trying to Add Object to Array

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