class 'ModalDirective' incorrectly implements interface 'AfterViewInit'

Question

I'm trying to add a modal to my project, so I found this library : ng2-bootstrap

I installed it first using the command : npm install ng2-bootstrap --save

My Class looks like :

import { Directive, ElementRef, Input, Renderer, AfterViewInit, OnDestroy } from 
@angular/core';
import { ModalModule } from 'ng2-bootstrap/ng2-bootstrap';

@Directive({
  selector: '[bsModal]',
  exportAs: 'bs-modal'
})
export class ModalDirective implements AfterViewInit, OnDestroy {
  @Input()
  public set config(conf:ModalOptions) {
    this._config = this.getConfig(conf);
  };

  @Output() public onShow:EventEmitter<ModalDirective> = new EventEmitter();
  @Output() public onShown:EventEmitter<ModalDirective> = new EventEmitter();
  @Output() public onHide:EventEmitter<ModalDirective> = new EventEmitter();
  @Output() public onHidden:EventEmitter<ModalDirective> = new EventEmitter();

}

But I got this Error :

class 'ModalDirective' incorrectly implements interface 'AfterViewInit'

Answer 1

If you use implements AfterViewInit, OnDestroy, then you need to implement the interface methods

export class ModalDirective implements AfterViewInit, OnDestroy {

  ngAfterViewInit() {
  }

  ngOnDestroy() {
  }
}

If you don't need to do anything in these lifecycle hooks, then just remove the implements AfterViewInit, OnDestroy

See Also:

• Lifecycle Hooks