Question

我正在尝试为项目添加模态，所以我找到了这个库：ng2-bootstrap

我首先使用以下命令安装它：npm install ng2-bootstrap --save

我的班级看起来像：

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();

}

但我得到了这个错误：

class 'ModalDirective' incorrectly implements interface 'AfterViewInit'

Answer 1

如果使用implements AfterViewInit, OnDestroy，则需要实现接口方法

export class ModalDirective implements AfterViewInit, OnDestroy {

  ngAfterViewInit() {
  }

  ngOnDestroy() {
  }
}

如果您不需要在这些生命周期挂钩中执行任何操作，请删除implements AfterViewInit, OnDestroy

另见：

Lifecycle Hooks

Answer 2

我在 ng2-bootstrap文档中找到了。

我认为你需要像这样添加你的组件：

var data = [{
    aKey:2, 
    bKey:2, 
    cKey:3
}, { 
    bKey:2, 
    cKey:6
}, {
    aKey:1,
    bKey:6, 
    cKey:5
}, {
    cKey:41
}, {
    cKey:7
}, {
    bKey:1, 
    cKey:4
}, {
    bKey:6, 
    cKey:7
}]


data.sort(function(a, b) {
  return ((b.aKey != undefined) - (a.aKey  != undefined) || a.aKey - b.aKey) ||
  	 ((b.bKey != undefined) - (a.bKey  != undefined) || ((a.bKey != 2) - (b.bKey != 2)) || a.bKey - b.bKey) ||
         ((b.cKey != undefined) - (a.cKey  != undefined) || a.cKey - b.cKey)
})

console.log(data)

Answer 3

如果您使用implements OnInit ， OnDestroy 方法，那么您应该实现其接口

export class ModalDirective implements OnInit, OnDestroy {

  ngOnInit() {
  }

  ngOnDestroy() {
  }
}

class'ModalDirective'错误地实现接口'AfterViewInit'

3 个答案: