Angular - how do I get data to load with ngOnChanges

» angular » Angular - how do I get data to load with ngOnChanges

By : user3100228

Date : January 12 2021, 01:40 AM

around this issue The reason ngOnChanges is not working because it works on @Input param changes. In your case, you are simply changing the value of the component from the component itself.
Take a look at this demo. I have made some code changes in your demo code and it seems to be doing the same thing which you are expecting.

code :

  createData() {
    this.testData = [];
    this.years = Math.floor(Math.random() * this.dates.length)
    console.log(this.years)
    for(let i:number= 0; i<=this.years; i++){
      this.testData[i] = {
        data_1: Math.floor(Math.random() * (this.max - this.min)),
        data_2: Math.floor(Math.random() * (this.max - this.min)),
        data_3: Math.floor(Math.random() * (this.max - this.min)),
        data_4: Math.floor(Math.random() * (this.max - this.min)),
        date: this.dates[i]
      }
    }    
    this.stack = d3.stack()
      .keys(['data_1', 'data_2', 'data_3', 'data_4']);
    if(this.hasPreviousData){
      this.createStack(this.testData);
    }else{
      this.hasPreviousData = true;
      this.initScales();
      this.initSvg();
      this.drawAxis();
      this.createStack(this.testData);
    }
  }

Share :

Angular 2 setters vs ngOnChanges

By : flazer

Date : March 29 2020, 07:55 AM

around this issue One advantage of ngOnChanges() is that you get all changes at once if your component has several @Input()s.
If your code only depends on a single @Input() a setter is probably the better approach.

angular 4 ngOnChanges not shows the changes

By : robz

Date : March 29 2020, 07:55 AM

To fix the issue you can do You can use ngOnChanges on input if you are using a child component, In your case simply use (change)="onChange($event)"

code :

 <input type="text" name="email"  [(ngModel)]="email"  (change)="onChange($event)"`** formControlName="email" placeholder="E-mail address">

Angular 2 triggering ngOnChanges

By : Alaa

Date : March 29 2020, 07:55 AM

Hope that helps I have an input field in Child component. When on blur event occurs, the value of this input passes to AppComponent by eventEmmiter and set a new value to the Key property of AppComponent. Since Child component's Key input decorator bind to this property, I'm expecting that ngOnChanges hook will be triggered in Child component, and will set previous value and current value to paragraphs. But it's not working. , You closed child tag too early:

code :

<child 
  [key]="key"> <-------------------------------- here
  (triggerInputChanges)="handleKey($event)"
</child>

<child 
  [key]="key"
  (triggerInputChanges)="handleKey($event)">
                                          ^^^^
                                          here
</child>

Angular ngOnChanges method

By : Rameshwor Dahal

Date : March 29 2020, 07:55 AM

hop of those help? ngOnChanges() is called when a parent component modifies (or initializes) the values bound to the input properties of a child. So if a component has no parent, the ngOnChanges() won't be invoked.
You are changing the values of the @Input properties using two-way binding, but this won't invoke ngOnChanges().

Angular 7: ngOnChanges fires only once

By : Adam King

Date : October 09 2020, 09:00 AM

To fix the issue you can do ngOnChanges only gets triggered when the @Input() gets changed from the parent component, not if you change it in you child component.