CODEWITHSUNDEEP
htmlangularformio
Code Lღver
Code Lღver

Reputation: 185

json object is not effecting to view

I am using angular Formio for dynamic screen creation, as part of that when I get the screen script from database, if I change the label of the particular element in ngOnInit() I am able to change.

but once the screen is displayed, then if I change the lable it is not effecting.

html

<Formio [form]="form" [submission]="submission" (submit)="onSubmit($event)"></formio>
<div class="mb-5">
    <div class="row">
      <div class="col-12 mb-5">
        <div class="pull-right" style="float:right;">
          <button class="btn save-button" (click)="clearData()">Clear data</button>
          <button class="btn save-button" (click)="showData()">Show data</button>
        </div>
      </div>
    </div>
  </div>

component

ngOnInit() {
    debugger;
    this.triggerRefresh = new EventEmitter();
    this.http.get('http://localhost:3000/angcomp/3')
    .subscribe(
      response  => {
        debugger;
        this.data = response.json();
        this.form = this.data;
        this.form.components[0].label = 'Changed';//it is updating the lable in view
      },
        err => {console.error(err)}
    ); 

}


showData() {

    this.form.components[0].label = 'Again Changed'; // here it is not changing but in this.form.components[0].label value is displaying as 'Again Changed', but not effecting in front end
}

Upvotes: 1

Views: 1798

Answers (1)

Samuel Knoch
Samuel Knoch

Reputation: 1195

Try the refresh property in formio

In yout HTML:

<Formio [refresh]="triggerRefresh" [form]="form" [submission]="submission" (submit)="onSubmit($event)"></formio>

In your component:

showData() {
    this.form.components[0].label = 'Again Changed';
    this.triggerRefresh.emit({
    form: this.form
});
}

https://github.com/formio/angular-formio/wiki/Form-Renderer#updating-forms-and-submissions

Upvotes: 3

Related Questions