Angular 2+ Динамический HTML шаблон

Question

После того, что здесь задокументировано: Динамический загрузчик компонентов .Я хочу знать, как можно обрабатывать данные внутри этого HeroJobAdComponent класса:

import { Component, Input } from '@angular/core';

import { AdComponent }      from './ad.component';

@Component({
  template: `
    <div class="job-ad">
      <h4>{{data.headline}}</h4> 

      {{data.body}}
    </div>
  `
})
export class HeroJobAdComponent implements AdComponent {
  @Input() data: any;

}

Как видите, data - это объект, содержащий полученные данные.Я хочу иметь возможность определить конструктор для моего HeroJobAdComponent класса, но если я это сделаю, объект data будет undefined внутри моего конструктора.Вместо этого я попытался использовать ngOnChange, который предположительно выполняется после того, как ввод изменяется с неопределенного на определенный, но также не выполняется вообще.

Может кто-то сначала объяснить, почему объект не определен, даже если данные определены вмой основной компонент называет это, и как обойти эту проблему?

Это конструктор, который я использую:

constructor()
{
    this.values = this.data.values;
    this.spec_name = this.data.spec_name;
}

Answer 1

Если вы хотите использовать какую-либо операцию при получении данных в вашем компоненте, вы можете использовать setter

export class HeroJobAdComponent implements AdComponent {

  _data;

  @Input() set data (data: any){
   //operation on data goes here
   this._data=data
  };

  get data() {
   return this._data;
  }

}