Angular

[Angular] MatSnackBarのテストをする

実践 テスト対象ソース 以下の単純なスナックバーを表示しているコンポーネントに対してテストする。 スナックバーをMatSnackBarで表示 テストソース テストケースはit関数内で、スナックバーのメッセー...
Angular

[Angular] スナックバーをMatSnackBarで表示

実践 app.component.ts MatSnackBarのopen関数で、スナックを表示させることができます。引数にdurationを設定すると、表示する時間を設定できます。 import { Component ...
Angular

[Angular] ダイアログをMatDialogを使って表示する

作るもの ボタンクリックにより、ダイアログを表示させるコンポーネントを作成ダイアログコンポーネントにパラメータを送るダイアログコンポーネントから、パラメータを受け取る 実践 ダイアログを呼び出す側のソース MadD...
Git

[Gitコマンド] ブランチの作成・マージ・現在のブランチの確認

現在のブランチの確認 以下のコマンドで自分がどのブランチにいるか確認できます。以下ではmasterブランチにいることが分かる。 >git branch * master ブランチの作成 以下のコマンドでブラン...
Angular

AngularをVSCodeでデバッグする方法

デバッグ設定 Angularのプロジェクトフォルダ直下にある.vscodeフォルダ内の、launch.jsonにデバッグ時の設定があります。基本的にデフォルトの設定で問題ないです。ポート番号やブラウザなどを変えたければ変えればいい感...
Angular

mat-tableのフィルターをfilterPredicateを使って行う[Angular]

filterPredicateとは mat-tableにあるデフォルトのフィルタリング動作が設定されているので、ここにオーバーライドすることで上書きできるメソッド。フィルタの処理をカスタマイズしたい場合は、ここの処理の戻り値を、抽出...
Angular

Angular Materialのテーブルをmat-tableで作ってみる

作ったテーブル ソースコード app.module.ts ここでは、MatTableModuleをインポートする。 import { NgModule } from '@angular/core&#...
Angular

[AngularMaterial] 環境構築・インストールする

インストールする Angularのプロジェクトにカレントディレクトリを移動して、以下のコマンドを実行します。 ng add @angular/material 以下のメッセージは、インストールするかどうかのメッセージなの...
Angular

[Angular] EventEmitterの使い方

EventEmitterとは カスタムイベントを作成するのに使われる。例えば、呼び出し先のコンポーネントでイベントが発生した場合、呼び出し元でイベントを検知して処理できる。 実践 button.component側で発生...
Git

[Gitコマンド] 変更内容確認・コミット・プッシュの方法

用語解説 コミットとは ローカルリポジトリに変更を反映させること プッシュとは ローカルリポジトリの変更をリモートリポジトリに反映させること 変更内容の確認 変更したファイルの確認 git sta...