在angular2中的指令之前加载组件

Question

I made small component in angular2 application that I am useas a directive, to enter small view in different pars of application. I only define options in the component where I am using this directive . This directive always expects to have options, and in my case it takes time until it gets the data from server and only then 'someOptions' will be defined. But this 'example' component expects it right away, how can I postpone it? Do you know how can I keep using this as a directive but tell angular to only activate it once the options are defined in component that is using this directive?

// the directive Im planning to use in differnt views
@Component({
  selector: 'expml-comp'
})

export class Example1 {
@Input() options: any;
  constructor() {}
  ngOninit(){
    //puting data from options to directive
  }
}

//and the component where I want to use this directive:
@Component({
  template: '<expml-comp [options] = 'definedData'></expml-comp>',
})
 export class Example2 {
  constructor() { }
  private definedData:any;
 //here I need to define the options but before the data comes from server      //the Example1 dir is already activated 
//and it didnt find definedData so it breaks
 ngOnInit(){
//this.definedData=...
 }

}

Answer 1

You can use ngOnChanges() . This method is called when a value bound to an input was changed.

export class Example1 {
  @Input() options: any;
  constructor() {}
  ngOnChanges(changes){
    if(this.options != null) {
      // options are set
    }
  }
}