大田区から発信するゆるゆる日記

主にITエンジニアに関する備忘録日記。たまに趣味も。何か不備があればコメント頂けると幸いです。Twitterアカウント https://twitter.com/ryuzan03

【Angular】console.logの表示方法【基礎中の基礎】

※下記の内容に不備がありましたら、コメント頂けると幸いです。また、下記の内容をご使用頂ける場合は自己責任でお願いします。

【目次】

 

背景

Angularでconsole.logどう出すんだろうと少し悩んだので備忘録書いておきます。
データ表示まではまだ調べていないので、必要な時に調べて更新します。

 

内容

component.htmlにクリックイベントを追加

どこかの要素にクリックイベントを追加します。

component.html

<a routerLink="/index" (click)="onSelect">クリック</a>

 

component.tsにメソッドを追加

component.tsのクラス内にメソッドを追加します。

component.ts

onSelect(): void {
console.log('ok');
}

 

開発者ツールで値「ok」を確認

Chromeなどの開発者ツールのconsole画面で「ok」が表示されているか確認しましょう。

 

表示されていれば、クリックイベントが正常に作動していることがわかります。

 

今後に向けて

データ表示もできるようになりたい。