使用* ngfor在Angular2中綁定動態填充的數組

Question

我正在嘗試在Angular2中動態填充數組。 下面是我的

import { Component } from '@angular/core';

@Component({
    selector: 'pm-app',
    templateUrl: 'app/app.component.html'
})
export class AppComponent {        
    ngOnInit(): void {
        let numbers: number[] = [];
        for (var i=1; i <= 9; i++) {
            numbers.push(i);
        }
    }
}

以下是HTML內容：

<div id="numbers-frame">
    <div class="well">
        <div *ngFor="let number of numbers; let i = index">
          {{i}} {{number}}
        </div>
    </div>
</div>

我根本沒有任何輸出。 誰能告訴我我在做什么錯？ 謝謝。

Answer 1

Angular2將組件視為上下文。 您應該在組件內聲明numbers屬性：

export class AppComponent {   
  numbers: number[] = [];

  ngOnInit(): void {
    for (var i=1; i <= 9; i++) {
      this.numbers.push(i);
    }
  }
}

柱塞示例