javascript - 在构造函数中访问 Angular 2 输入(属性)

Question

我正在创建一些组件以学习 Angular2。

我有这个基本的 html:

<h1>test</h1>
<btn [order]="0"></btn>
<btn [order]="1"></btn>
<btn [order]="2"></btn>

在 ts 中我有这个:

import {Component, Input} from 'angular2/core';
import {DataService} from '../services/DataService';

@Component({
    selector: 'btn',
    template: '<button>test{{ item }}</button>',
    inputs: ['order']
})

export class ButtonComponent {
    items: Array<number>;
    item: number;
    @Input() order;

    constructor(dataService: DataService) {
        console.log(this.order)
    }
}

这样做我变得不确定，我做错了什么？如何读取输入(或属性)以便将数据发送到类？

编辑

import {Component, Input} from 'angular2/core';
import {DataService} from '../services/DataService';

@Component({
    selector: 'btn',
    template: '<button>test{{ item }}</button>',
    inputs: ['order']
})

export class ButtonComponent {
    items: Array<number>;
    item: number;
    @Input() order;

    ngOnInit(dataService: DataService) {
        this.items = dataService.getItems();
        console.log(this.order)
    }

    constructor() {}
}

Answer 1

你不能在构造函数中访问它们，它们还没有被初始化。请改用 ngOnInit()。有关详细信息，请参阅 https://angular.io/docs/ts/latest/guide/lifecycle-hooks.html

export class ButtonComponent implements OnInit {
    items: Array<number>;
    item: number;
    @Input() order;

    constructor(dataService: DataService) {  }

    ngOnInit() {
      console.log(this.order);
    }
}