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);
}
}
【Angularの最新記事】
- Angularの構造ディレクティブ(St..
- AngularのRenderer2でDO..
- AngularでネイティブのDOMにアク..
- AngularでDirectiveの作成..
- Angularでカスタムパイプを作る
- AngularでURLのパラメーターを取..
- AngularでN文字以上をトリミング
- AngularでBehaviorSubj..
- Angularで「WARNING .. ..
- angularでdebounce
- angular cliで作ったプロジェク..
- Angular2でformControl..
- Angular2のloadChildre..
- ElementRef - @angula..
- Angular 2のng2-dragul..
- Angular 2のDatePipe
- Angular2のRouting2
- Angular2のRouting
- Angular2のサービス
- Angular2のコンポーネント
2016年12月21日
Angular2のライフサイクルメソッド
OnInitやOnChangesをimportしておけば子コンポーネントでngOnInitやngOnChangesといったライフサイクルメソッドが利用可能
この記事へのコメント
コメントを書く
この記事へのトラックバック