Расширение NgFor приводит к дублированию вывода

Ссылка на эту пользовательскую директиву Angular 2 (которая расширяет NgFor) в компоненте, а затем использование NgFor на странице приводит к дублированию перечисления:

import {
    Directive,
    ChangeDetectorRef,
    IterableDiffers,
    ViewContainerRef,
    TemplateRef,
    ElementRef
} from '@angular/core';
import { Observable } from 'rxjs';
import { Router } from '@angular/router';
import { NgFor } from '@angular/common';
import { NgForRow } from './ngForRow';

import { AppComponent } from '../../app.component';

@Directive({
    selector: '[ngTreeLeaf][ngTreeLeafOf]',
    inputs: [
        'ngTreeLeafOf',
        'ngTreeLeafTemplate',
        'ngTreeLeafRoute'
    ]
})
export class NgTreeLeaf extends NgFor {
    private _routePattern: RegExp;

    constructor(
        viewContainer: ViewContainerRef,
        templateRef: TemplateRef<NgForRow>,
        iterableDiffers: IterableDiffers,
        cdr: ChangeDetectorRef,
        private _router: Router,
        private _elementRef: ElementRef) {
        super(viewContainer, templateRef, iterableDiffers, cdr);
    }

    set ngTreeLeafOf(leaves: Array<any>) {
        this.ngForOf = leaves;
    }

    set ngTreeLeafRoute(route: string) {
        this._routePattern = new RegExp(route + "\\b", "g");
    }

    set ngTreeLeafTemplate(value: TemplateRef<NgForRow>) {
        this.ngForTemplate = value;
    }

    isLeafActive(urlString: string) {
        if (!this._router || !this._routePattern) return false;
        let active = this._routePattern.test(this._router.url);
        if (active) {
            this._elementRef.nativeElement.parentElement.classList.add("active");
        }
        else {
            this._elementRef.nativeElement.parentElement.classList.remove("active");
        }
        return active;
    }
}

Как упоминается в в этом ответе, аннотации не наследуются, поэтому я не уверен, откуда взялся мотив для применения моего кода. кроме того. Я предполагаю, что это должно быть либо имя родительского класса, взаимодействующее с DI, либо комбинация обнаруживаемого DoCheck и переменной, которая каким-то образом разделяется. Но я не сразу вижу проблему.

Какие-либо предложения? Также кажется здесь, как будто я не ожидал этой проблемы.


person shannon    schedule 22.07.2016    source источник