Angular

概要本番環境や開発環境などで、APIのURLの向き先など、環境によって異なる設定値（環境変数）を設定していくやり方を備忘録として残していきます。やり方はenviroment.tsを使って行います。環境はstaging環境（本番環境）、dev...

日本日付の日を消したいprovidersで、ロケールを以下のように日本にできるが、カレンダーに日が入っていて、デザインが微妙なので日を消すようにする。 providers: [ ~ { provide: MAT_DATE_L...

別のコンポーネントのテンプレートを呼び出すAngular18のバージョンで実装していきます。まずは別のコンポーネントとして、TestComponentを作ります。import { Component } from '@angular...

MatDatepickerで日本日付の入力フォームを作る環境バージョンは以下。Angular18angular/material@18.2.2機能実装コンポーネント側は、以下のモジュールとproviderの設定をします。@Component...

Angular MaterialとはAngular Materialとは、Googleが提唱しているマテリアルデザインというものを、Angularで使えるようにした、UI部品です。環境以下の環境で、インストール・環境構築をしていきます。An...

ユーザー認証の方法Angularでユーザー認証を行う場合、どのようにコードを書けばよいか調べたので、備忘録として残します。Angularのバージョンは18です。実装方法概要サービスやファイルの概要を説明します。AuthService：ログイ...

ルーティングでアクセス制限を行うURLのルートによって、アクセス制限をしていきます。バージョンはAngular18です。実装例アクセス制限を行うファイルを作成アクセス制限を行うファイルを作成するコマンドがあるのでそれで作成します。以下のコマ...

ルーティングの設定を行う Angular17辺りから、プロジェクトの構成などが変わって、少しやり方が変わってそうだったため、Angular18で、ルーティングの設定を行うためのコードを実装していきます。ルーティングといっているのは、url...

rxjsでエラー時と正常終了のどちらでも共通の処理を行うAngularのrxjsでhttp通信の処理などを行った際、エラー時と正常終了のどちらでも共通の処理を行う方法について、気になったので調べました。対応方法としては、rxjsオペレーター...

インターセプターについてHttpClientによるhttp通信の処理で、どのapi呼び出しでも、共通の処理を行いたいといったときに、インターセプターの機能が便利です。実装interceptorcustom.intercepter.tsファイ...