Question

我正在尝试使用Angular 2.0.0-beta.15 中的手风琴或面板，但当我尝试使其工作时，我有以下消息“Property'ngOnDestroy'缺失在“NgbAccordionGroup”类型中

import {bootstrap} from '@angular/platform-browser-dynamic';
import {Component, OnDestroy} from '@angular/core';

@Component({
  selector: 'ngb-accordion,[ngb-accordion]',
  inputs: ['onlyOneOpen: closeOthers'],
  template: `<ng-content></ng-content>`
})
export class NgbAccordion {
  private onlyOneOpen: boolean;
  private groups: Array<NgbAccordionGroup> = [];

  addGroup(group: NgbAccordionGroup): void { this.groups.push(group); }

  closeOthers(openGroup): void {
    if (!this.onlyOneOpen) {
      return;
    }

    this.groups.forEach((group: NgbAccordionGroup) => {
      if (group !== openGroup) {
        group.isOpen = false;
      }
    });
  }

  removeGroup(group: NgbAccordionGroup): void {
    const index = this.groups.indexOf(group);
    if (index !== -1) {
      this.groups.splice(index, 1);
    }
  }
}

@Component({
  selector: 'ngb-accordion-group,[ngb-accordion-group]', 
  inputs: ['heading', 'isOpen', 'isDisabled'],
  template: `
    <div class="card">
      <div class="card-header">
        <a href tabindex="0"><span [class.text-muted]="isDisabled" (click)="toggleOpen($event)">{{heading}}</span></a>
      </div>
      <div class="card-block" [hidden]="!isOpen">
        <div class="card-text">
            <ng-content></ng-content>
        </div>
      </div>
    </div>
  `
})
export class NgbAccordionGroup implements OnDestroy {
  private isDisabled: boolean;
  private _isOpen: boolean = false;

  constructor(private accordion: NgbAccordion) { this.accordion.addGroup(this); }

  toggleOpen(event) {
    event.preventDefault();
    if (!this.isDisabled) {
      this.isOpen = !this.isOpen;
    }
  }

  onDestroy(): void { this.accordion.removeGroup(this); }

  public get isOpen(): boolean { return this._isOpen; }

  public set isOpen(value: boolean) {
    this._isOpen = value;
    if (value) {
      this.accordion.closeOthers(this);
    }
  }
}

@Component({
  selector: 'my-app',
  templateUrl: './src/app.html'
  directives: [NgbAccordion, NgbAccordionGroup]
})
export class App {
  firstDisabled:boolean = false;
  isOpen:boolean = false;

}

bootstrap(App, []).catch(err => console.error(err));

或者看看http://plnkr.co/edit/we3EsK?p=preview 现在正在RC1工作，但我必须回到Angular 2.0.0-beta.15

有什么想法吗？

Answer 1

onDestroy(): void { this.accordion.removeGroup(this); }

应该是

ngOnDestroy(): void { this.accordion.removeGroup(this); }

错误消息来自

... implements OnDestroy {

没有实际实施其成员。

Angular2中的小组手风琴

1 个答案: