Angular(バージョン2以降)の勉強、その12です
前回でクリックイベントができたので
今回はインプットイベントになります
formの部分で使うので大事です
- template側(/app/servers/servers.component.html)
- TypeScript側(/app/servers/servers.component.ts)親子関係の親の部分です
- 結果
Angular(バージョン2以降)の勉強、その12です
前回でクリックイベントができたので
今回はインプットイベントになります
formの部分で使うので大事です
Angular(バージョン2以降)の勉強、その11です
クリックイベントを起こすのを記載します
普通のjavascriptだと「onclick=xxxx」と記載しますが
Angularだと「(click)="xxxxx"」と記載します
TypeScript側(/app/servers/servers.component.ts)親子関係の親の部分です
export class ServersComponent implements OnInit { allowNewServer = false; serverCreationStatus = "No Server was created" constructor() { setTimeout(() =>{ this.allowNewServer = true; },3000); } ngOnInit() { } onCreateServer(){ this.serverCreationStatus ='Server was created' } }
追加したのが「onCreateServerの部分になります」
template側(/app/servers/servers.component.html)
<button class="btn btn-primary" [disabled]="!allowNewServer" (click)="onCreateServer()">追加するよ</button> <p>{{serverCreationStatus}}</p> <p>{{ allowNewServer}}</p>
ここではonclickではなく(click)になっている所が重要です
結果
普通に切り替わりました
次はインプットイベントについて記載します
masalib.hatenablog.com
Angular 2: From Theory To Practice (English Edition)
Beginning Angular 2 with Typescript (English Edition)
Angular(バージョン2以降)の勉強、その10です
当たり前だけどhtmlのプロパティーも触れます
その部分について記載します
Angular(バージョン2以降)の勉強、その9です
tyepscriptの変数をhtmlのテンプレートというかHMTLに反映させる
講義ではデータバイディングみたいに記載してあった