Pab*_*blo 2 javascript angular
我正在创建一些组件以学习Angular2.
我有这个基本的HTML:
<h1>test</h1>
<btn [order]="0"></btn>
<btn [order]="1"></btn>
<btn [order]="2"></btn>
Run Code Online (Sandbox Code Playgroud)
在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)
}
}
Run Code Online (Sandbox Code Playgroud)
这样做我得到了不确定,我做错了什么?如何读取输入(或属性)以便将数据发送到类?
编辑
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() {}
}
Run Code Online (Sandbox Code Playgroud)
您无法在构造函数中访问它们,它们尚未初始化.请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);
}
}
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
2812 次 |
| 最近记录: |