Input field not resetting value - AngularJS 2

Question

export class ParametersForm {
  myForm: ControlGroup;
  systemParameters: AbstractControl;
  arr: number[];
  constructor(fb: FormBuilder) {
    this.myForm = fb.group({
      "realisations" : [""],
      "numConstSteps" : [""],
      "timeHorizon": [""],
      "continuationStep" : [""],
      "continuationStepSign" : [""],
      "numberOfModelParameters" : [""],
      "systemParameters" : [],
      "param" : [""],
      "netLogoFile" : [""],
      "numberOfModelVariables" : [""],
      "restrictOperator" : [""],
      "liftOperator" : [""],
      "xInitial" : [""]

    });
    this.arr = [];
    this.systemParameters = this.myForm.controls["systemParameters"];
  }
  addToArray(value: any): void {
    this.arr.push(value);
    this.systemParameters = null;
  }
  onSubmit(form: any): void {
    console.log(this.arr);
    form.systemParameters = this.arr;
    console.log("your submitted value:", form)
  }
}

form

@Component({
    selector: 'parameters-form',
    directives: [FORM_DIRECTIVES],
    template: `
      <h1>Parameters Form</h1>

      <form [ngFormModel]="myForm" (ngSubmit)="onSubmit(myForm.value)" class="ui form">

<div class="field">
            <label for="systemParameters">System Parameterss</label>
            <input type="number"
                   id="systemParameters"
                   placeholder="systemParameters Param"
                   [ngFormControl]="myForm.controls['systemParameters']" #systemParam>

            <button type="button" (click)="addToArray(systemParam.value)">Add</button>
          </div>

<button type="submit" class="ui button">Submit</button>
      </form>
    `
})

The problem is when i click the "add" button the field is not resetting so that i can input my next value without removing old one.

Petros Kyriakou · Accepted Answer · 2016-02-14 13:16:07Z

1

Instead of

this.systemParameters = null;

this should work

import { Control } from "angular2/common";

(<Control>this.systemParameters).updateValue('');

edited Feb 14, 2016 at 13:16

Petros Kyriakou

5,3934 gold badges51 silver badges85 bronze badges

answered Feb 14, 2016 at 12:56

Günter Zöchbauer

661k235 gold badges2.1k silver badges1.6k bronze badges

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

2 Comments

Petros Kyriakou Over a year ago

Um thanks but this does not compile "cannot find name control"

Günter Zöchbauer Over a year ago

You need to import Control I guess.

Collectives™ on Stack Overflow

Input field not resetting value - AngularJS 2

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related