2016-06-07 63 views
1

我正嘗試使用手風琴或面板中的Angular 2.0.0-beta.15,但是當我嘗試使其工作時,我收到以下消息:「Property'ngOnDestroy'缺失類型「NgbAccordionGroup」Angular2中的面板手風琴

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,但我必須做出回角2.0.0 beta.15

有什麼想法?

回答

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

應該

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

錯誤消息來自

... implements OnDestroy { 

沒有實際履行其成員。