Angular 2: leeres Array in der Komponente HTML

Question

ich ein einfaches Projekt mache:

Es gibt zwei Eingangsschieberegler und eine Schaltfläche ‚Berechnen‘, wenn die Taste gedrückt wird, Berechnungen durchgeführt und in eine Tabelle gedruckt.

Ich habe ein kleines Problem, wenn ich den Knopf drücke, zeigt die Tabelle Component das Antwort-Array ist leer, aber wenn ich es aus dem Konstruktor auf der Konsole ausdrucken, wird alles angezeigt.

Könnte jemand helfen? Ich möchte eine *ngFor machen und die Elemente später durchlaufen.

Service:

@Injectable() 
export class DataService { 

    loanArray: Payment[] = []; 

    setCalculatedPayments(loanSum: number, loanTime:number) { 
    this.loanArray = new PaymentsCalculated(loanSum, loanTime).calculateLoanDetails(); 
    } 

    getCalculatedPayments() { 
    return this.loanArray; 
    } 
} 

Darlehenskomponente:

export class LoanTablesComponent implements OnInit { 

    loanArray: Payment[] = []; // is it always empty? 

    constructor(private DataService: DataService) { 
    this.loanArray = this.DataService.getCalculatedPayments(); 
    // here it prints the loanArray as required 
    // but if I print out in the .html, it is always zero 
    } 

    ngOnInit() { 
    } 

} 

Berechnung Komponente:

export class CalculatorComponent implements OnInit { 

    loanSum: number; 
    loanTime: number; 

    constructor(private DataService: DataService) { 
    setTimeout(() => this.loanSum = 500); 
    setTimeout(() => this.loanTime = 1); 
    // for input sliders 
    } 

    ngOnInit() { 
    } 

    calculatePayments(): void{ 
    this.DataService.setCalculatedPayments(this.loanSum, this.loanTime); 
    } 

} 

Vielen Dank für Hilfe, nur zu lernen und Ratsuchende (:

Answer 1

In das Ende Ich habe gerade Argument übergeben mit @Output und @Input und Lerndienste sind für andere thigs: D