2016年12月21日

Angular2のライフサイクルメソッド

OnInitやOnChangesをimportしておけば子コンポーネントでngOnInitやngOnChangesといったライフサイクルメソッドが利用可能

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

@Component({
selector: 'my-app',
template: `
<div>
<my-h1 [myText]=h1></my-h1>
<p (click)="onClick()">click</p>
</div>
`
})
export class AppComponent{
h1:string = "h1";
onClick(){
this.h1 = this.h1+"!";
}
}


import { Component, Input,OnInit,OnChanges } from '@angular/core';

@Component({
selector: 'my-h1',
template: `
<h1>{{myText}}</h1>
`
})
export class h1Component implements OnInit,OnChanges{
@Input() myText:String;
ngOnInit() {
console.log("ngOnInit")
}
ngOnChanges(changes) {
console.log('ngOnChanges',changes);
}
}
タグ:Angular2
posted by ねこまんま at 13:03 | Comment(0) | TrackBack(0) | Ajax | 更新情報をチェックする
この記事へのコメント
コメントを書く
お名前:

メールアドレス:

ホームページアドレス:

コメント:

※ブログオーナーが承認したコメントのみ表示されます。

この記事へのトラックバック