typescript - Miten tietää, mikä @Input muuttuu ngOnChangesissa?


Käytän Angular 2:ta.

Tällä hetkellä minulla on kaksi @input aa ja bb. Haluan tehdä:

  1. Jos aa muuttuu, tee jotain.
  2. Jos bb muuttuu, tee jotain muuta.

Miten tietää, mikä @Input muuttuu ngOnChanges-metodissa? Kiitos

  @Input() aa;
  @Input() bb;

  ngOnChanges(changes: { [propName: string]: SimpleChange }) {
    // if aa changes, do something
    // if bb changes, do other thing
  }

Vastaus #1

Ehkä pystyy tekemään sen näin

ngOnChanges(changes: { [propName: string]: SimpleChange }) {
  if( changes['aa'] && changes['aa'].previousValue != changes['aa'].currentValue ) {
    // aa prop changed
  }
  if( changes['bb'] && changes['bb'].previousValue != changes['bb'].currentValue ) {
    // bb prop changed
  }
}

Olen yllättynyt siitä, että muuttumattomat ominaisuudet on määritelty. Keittokirjan perusteella odottaisin, että vain muutetut ominaisuudet määriteltäisiin.

https://angular.io/docs/ts/latest/cookbook/component-communication.html#!#parent-to-child-on-changes

Jos se on liian pitkäveteistä, voit myös kokeilla käyttää asetusmenetelmää:

_aa: string;
_bb: string;

@Input() set aa(value: string) {
  this._aa = value;
  // do something on 'aa' change
}

@Input() set bb(value: string) {
  this._bb = value;
  // do something on 'bb' change
}

https://angular.io/docs/ts/latest/cookbook/component-communication.html#!#parent-to-child-setter

Aiheeseen liittyviä artikkeleita